Bug 1624732 [wpt PR 22426] - WebDriver - Add test for Drag and Drop A…

…PI, a=testonly

Automatic update from web-platform-tests
WebDriver - Add test for Drag and Drop API (#22426)

This adds a test for dragging and dropping an element that
has a draggable attribute

--

wpt-commits: 4984c88d5ce94f206f979848513595484ca7b72b
wpt-pr: 22426

testing/web-platform/tests/webdriver/tests/perform_actions/pointer.py

@@ -141,3 +141,34 @@ def test_drag_and_drop(session,
     final_rect = drag_target.rect
     assert initial_rect["x"] + dx == final_rect["x"]
     assert initial_rect["y"] + dy == final_rect["y"]
+
+
+@pytest.mark.parametrize("drag_duration", [0, 300, 800])
+def test_drag_and_drop_with_draggable_element(session,
+                       test_actions_page,
+                       mouse_chain,
+                       drag_duration):
+    drag_target = session.find.css("#draggable", all=False)
+    drop_target = session.find.css("#droppable", all=False)
+    # Conclude chain with extra move to allow time for last queued
+    # coordinate-update of drag_target and to test that drag_target is "dropped".
+    mouse_chain \
+        .pointer_move(0, 0, origin=drag_target) \
+        .pointer_down() \
+        .pointer_move(50,
+                      25,
+                      duration=drag_duration,
+                      origin=drop_target) \
+        .pointer_up() \
+        .pointer_move(80, 50, duration=100, origin="pointer") \
+        .perform()
+    # mouseup that ends the drag is at the expected destination
+    e = get_events(session)
+    assert e[1]["type"] == "dragstart", "Events captured were {}".format(e)
+    assert e[2]["type"] == "dragover", "Events captured were {}".format(e)
+    drag_events_captured = [ev["type"] for ev in e if ev["type"].startswith("drag") or ev["type"].startswith("drop")]
+    assert "dragend" in drag_events_captured
+    assert "dragenter" in drag_events_captured
+    assert "dragexit" in drag_events_captured
+    assert "dragleave" in drag_events_captured
+    assert "drop" in drag_events_captured

testing/web-platform/tests/webdriver/tests/perform_actions/support/test_actions_wdspec.html

@@ -9,6 +9,7 @@
       #resultContainer { width: 600px; height: 60px; }
       .area { width: 100px; height: 50px; background-color: #ccc; }
       .block { width: 5px; height: 5px; border: solid 1px red; }
+      .box { display: flex;}
       #dragArea { position: relative; }
       #dragTarget { position: absolute; top:22px; left:47px;}
     </style>
@@ -167,8 +168,20 @@
           window.addEventListener("mousemove", move(pointer, 15, 15, 30));
           // drag and drop
           els.dragArea = document.getElementById("dragArea");
+          els.dragArea.addEventListener("dragstart", recordPointerEvent);
           els.dragTarget = document.getElementById("dragTarget");
           els.dragTarget.addEventListener("mousedown", grabOnce);
+
+          var draggable = document.getElementById("draggable");
+          draggable.addEventListener("dragstart", recordPointerEvent);
+          draggable.addEventListener("dragenter", recordPointerEvent);
+          draggable.addEventListener("dragend", recordPointerEvent);
+          draggable.addEventListener("dragleave", recordPointerEvent);
+          draggable.addEventListener("dragover", recordPointerEvent);
+          draggable.addEventListener("dragexit", recordPointerEvent);
+
+          var droppable = document.getElementById("droppable");
+          droppable.addEventListener("drop", recordPointerEvent);
         });
     </script>
 </head>
@@ -189,6 +202,13 @@ <h2>DragReporter</h2>
       <div id="dragTarget" class="block"></div>
     </div>
   </div>
+  <div>
+    <h2>draggable</h2>
+    <div class=box>
+      <div id=draggable draggable="true" class="area"></div>&nbsp;
+      <div id=droppable dropzone="true" class="area"></div>
+    </div>
+  </div>
   <div id="resultContainer">
     <h2>Events</h2>
     <div id="events"></div>