module Decidim::FrontEndPointerTestHelpers

def drag(selector, mode: "mouse", direction: nil, amount: 0)
  move =
    case direction
    when "left"
      "x -= #{amount}"
    when "right"
      "x += #{amount}"
    when "top"
      "y -= #{amount}"
    when "bottom"
      "y += #{amount}"
    end
  events =
    if mode == "touch"
      <<~JS
        var evStart = new Event("touchstart");
        evStart.touches = [{ pageX: rect.x, pageY: rect.y }];
        var evMove = new Event("touchmove");
        evMove.touches = [{ pageX: x, pageY: y }];
        element.dispatchEvent(evStart);
        document.dispatchEvent(evMove);
        document.dispatchEvent(new Event("touchend"));
      JS
    else
      <<~JS
        element.dispatchEvent(new MouseEvent("mousedown", { clientX: rect.x, clientY: rect.y }));
        document.dispatchEvent(new MouseEvent("mousemove", { clientX: x, clientY: y }));
        document.dispatchEvent(new MouseEvent("mouseup"));
      JS
    end
  page.execute_script(
    <<~JS
      var element = document.querySelector("#{selector}");
      var rect = element.getBoundingClientRect();
      var x = rect.x;
      var y = rect.y;
      #{move};
      #{events}
    JS
  )
end