Update a pointerevent WPT to match original Interop 2023 target

Few months ago we inadvertently added sub-tests for interleaved handling of PointerEvents and MouseEvents. We are moving those sub-tests into separate tentative tests for Issue 1500354, and updating the original ones to be MouseEvent-only tests. Bug: 1147998, 1500354 Change-Id: Iedbfe5dd9f7c928534009762dcc8b567279d421a Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5008504 Commit-Queue: Mustaq Ahmed <mustaq@chromium.org> Reviewed-by: Robert Flack <flackr@chromium.org> Cr-Commit-Position: refs/heads/main@{#1222577}
web-platform-tests · Nov 9, 2023 · e1e0093 · e1e0093
1 parent 70bbf27
commit e1e0093
Show file tree

Hide file tree

Showing 4 changed files with 337 additions and 10 deletions.
diff --git a/pointerevents/pointerevent_after_target_appended.html b/pointerevents/pointerevent_after_target_appended.html
@@ -190,31 +190,30 @@
   ]);
 
   // Same tests for dispatched compatibility mouse events.
-  addPromiseTestForNewChild("pointerdown", "mouse", [
+  addPromiseTestForNewChild("mousedown", "mouse", [
     "mouseover@parent", "mouseenter@parent",
     "mousedown@parent", "(child-attached)",
     "mouseover@child", "mouseenter@child",
     "mouseup@child",
     "mousedown@child", "mouseup@child",
     "mouseout@child", "mouseleave@child", "mouseleave@parent"
   ]);
-  addPromiseTestForNewChild("pointerup", "mouse", [
+  addPromiseTestForNewChild("mouseup", "mouse", [
     "mouseover@parent", "mouseenter@parent",
     "mousedown@parent", "mouseup@parent", "(child-attached)",
     "mouseover@child", "mouseenter@child",
     "mousedown@child", "mouseup@child",
     "mouseout@child", "mouseleave@child", "mouseleave@parent"
   ]);
-
-  addPromiseTestForMovedChild("pointerdown", "mouse", [
+  addPromiseTestForMovedChild("mousedown", "mouse", [
     "mouseover@child", "mouseenter@parent", "mouseenter@child",
     "mousedown@child", "(child-moved)",
     "mouseover@child", "mouseenter@child",
     "mouseup@child",
     "mousedown@child", "mouseup@child",
     "mouseout@child", "mouseleave@child", "mouseleave@parent"
   ]);
-  addPromiseTestForMovedChild("pointerup", "mouse", [
+  addPromiseTestForMovedChild("mouseup", "mouse", [
     "mouseover@child", "mouseenter@parent", "mouseenter@child",
     "mousedown@child", "mouseup@child", "(child-moved)",
     "mouseover@child", "mouseenter@child",

diff --git a/pointerevents/pointerevent_after_target_appended_interleaved.tentative.html b/pointerevents/pointerevent_after_target_appended_interleaved.tentative.html
@@ -0,0 +1,200 @@
+<!DOCTYPE HTML>
+<!--
+   Tentative due to:
+   https://github.com/w3c/pointerevents/issues/492
+-->
+<title>
+  Enter/leave events fired to parent after child is added
+  right before compat mouse-event
+</title>
+<meta name="variant" content="?mouse">
+<meta name="variant" content="?touch">
+<meta name="variant" content="?pen">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="pointerevent_support.js"></script>
+
+<style>
+  div.target {
+      width: 100px;
+      height: 100px;
+  }
+</style>
+<div class="target" id="parent">
+  <div class="target" id="child">child</div>
+</div>
+<div id="done">done</div>
+
+<script>
+  'use strict';
+  const pointer_type = location.search.substring(1);
+
+  const parent = document.getElementById("parent");
+  const child = document.getElementById("child");
+  const done = document.getElementById("done");
+
+  let event_log = [];
+  let logged_event_prefix = "";
+  let received_compat_mouse_events = false;
+
+  function logEvent(e) {
+    if (e.type.startsWith(logged_event_prefix) && e.eventPhase == e.AT_TARGET) {
+      event_log.push(e.type + "@" + e.target.id);
+    }
+    if (e.type.startsWith("mouse")) {
+      received_compat_mouse_events = true;
+    }
+  }
+
+  function attachChild(e) {
+    if (e.eventPhase == e.AT_TARGET) {
+      parent.appendChild(child);
+      event_log.push("(child-attached)");
+    }
+  }
+
+  let child_moved = false;
+
+  function moveChild(e) {
+    if (!child_moved) {
+      child_moved = true;
+      parent.appendChild(child);
+      event_log.push("(child-moved)");
+    }
+  }
+
+  function setup() {
+    const logged_event_suffixes =
+        ["over", "out", "enter", "leave", "down", "up"];
+    let targets = document.getElementsByClassName("target");
+    for (let i = 0; i < targets.length; i++) {
+      logged_event_suffixes.forEach(suffix => {
+        targets[i].addEventListener("pointer" + suffix, logEvent);
+        targets[i].addEventListener("mouse" + suffix, logEvent);
+      });
+      targets[i].addEventListener("click", logEvent);
+    }
+  }
+
+  function addPromiseTestForNewChild(attaching_event,
+      tested_event_prefix, expected_events) {
+    const test_name = `${tested_event_prefix} events from ${pointer_type} `+
+        `received before/after child attached at ${attaching_event}`;
+
+    promise_test(async test => {
+      event_log = [];
+      logged_event_prefix = tested_event_prefix;
+
+      // We started with child attached to ease event listener setup above.
+      parent.removeChild(child);
+
+      parent.addEventListener(attaching_event, attachChild);
+      test.add_cleanup(() => {
+        parent.removeEventListener(attaching_event, attachChild);
+      });
+
+      let done_click_promise = getEvent("click", done);
+
+      let actions = new test_driver.Actions()
+          .addPointer("TestPointer", pointer_type)
+          .pointerMove(-30, -30, {origin: parent})
+          .pointerDown()
+          .pointerUp()
+          .pointerMove(30, 30, {origin: parent})
+          .pointerDown()
+          .pointerUp()
+          .pointerMove(0, 0, {origin: done})
+          .pointerDown()
+          .pointerUp();
+
+      await actions.send();
+      await done_click_promise;
+
+      if (tested_event_prefix == "mouse" && !received_compat_mouse_events) {
+        expected_events = [];
+      }
+
+      assert_equals(event_log.toString(), expected_events.toString(),
+          "events received");
+    }, test_name);
+  }
+
+  function addPromiseTestForMovedChild(mover_event,
+      tested_event_prefix, expected_events) {
+    const test_name = `${tested_event_prefix} events from ${pointer_type} `+
+        `received before/after child moved at ${mover_event}`;
+
+    promise_test(async test => {
+      event_log = [];
+      logged_event_prefix = tested_event_prefix;
+      child_moved = false;
+
+      child.addEventListener(mover_event, moveChild);
+      test.add_cleanup(() => {
+        child.removeEventListener(mover_event, moveChild);
+      });
+
+      let done_click_promise = getEvent("click", done);
+
+      let actions = new test_driver.Actions()
+          .addPointer("TestPointer", pointer_type)
+          .pointerMove(-30, -30, {origin: parent})
+          .pointerDown()
+          .pointerUp()
+          .pointerMove(30, 30, {origin: parent})
+          .pointerDown()
+          .pointerUp()
+          .pointerMove(0, 0, {origin: done})
+          .pointerDown()
+          .pointerUp();
+
+      await actions.send();
+      await done_click_promise;
+
+      if (tested_event_prefix == "mouse" && !received_compat_mouse_events) {
+        expected_events = [];
+      }
+
+      assert_equals(event_log.toString(), expected_events.toString(),
+          "events received");
+    }, test_name);
+  }
+
+  setup();
+
+  // Tests for dispatched compatibility mouse events
+  // after DOM modification through pointer events.
+  addPromiseTestForNewChild("pointerdown", "mouse", [
+    "mouseover@parent", "mouseenter@parent",
+    "mousedown@parent", "(child-attached)",
+    "mouseover@child", "mouseenter@child",
+    "mouseup@child", "click@parent",
+    "mousedown@child", "mouseup@child", "click@child",
+    "mouseout@child", "mouseleave@child", "mouseleave@parent"
+  ]);
+  addPromiseTestForNewChild("pointerup", "mouse", [
+    "mouseover@parent", "mouseenter@parent",
+    "mousedown@parent", "mouseup@parent", "(child-attached)", "click@parent",
+    "mouseover@child", "mouseenter@child",
+    "mousedown@child", "mouseup@child", "click@child",
+    "mouseout@child", "mouseleave@child", "mouseleave@parent"
+  ]);
+  addPromiseTestForMovedChild("pointerdown", "mouse", [
+    "mouseover@child", "mouseenter@parent", "mouseenter@child",
+    "mousedown@child", "(child-moved)",
+    "mouseover@child", "mouseenter@child",
+    "mouseup@child", "click@child",
+    "mousedown@child", "mouseup@child", "click@child",
+    "mouseout@child", "mouseleave@child", "mouseleave@parent"
+  ]);
+  addPromiseTestForMovedChild("pointerup", "mouse", [
+    "mouseover@child", "mouseenter@parent", "mouseenter@child",
+    "mousedown@child", "mouseup@child", "(child-moved)", "click@child",
+    "mouseover@child", "mouseenter@child",
+    "mousedown@child", "mouseup@child", "click@child",
+    "mouseout@child", "mouseleave@child", "mouseleave@parent"
+  ]);
+</script>
diff --git a/pointerevents/pointerevent_after_target_removed.html b/pointerevents/pointerevent_after_target_removed.html
@@ -118,16 +118,16 @@
   ]);
 
   // Same tests for dispatched compatibility mouse events.
-  addPromiseTest("pointerdown", "mouse", [
+  addPromiseTest("mousedown", "mouse", [
     "mouseover@child", "mouseenter@parent", "mouseenter@child",
-    "(child-removed)", "mouseover@parent", "mousedown@parent", "mouseup@parent",
+    "mousedown@child", "(child-removed)", "mouseover@parent", "mouseup@parent",
     "mousedown@parent", "mouseup@parent",
     "mouseout@parent", "mouseleave@parent"
   ]);
-  addPromiseTest("pointerup", "mouse", [
+  addPromiseTest("mouseup", "mouse", [
     "mouseover@child", "mouseenter@parent", "mouseenter@child",
-    "mousedown@child", "(child-removed)", "mouseover@parent", "mouseup@parent",
-    "mousedown@parent", "mouseup@parent",
+    "mousedown@child", "mouseup@child", "(child-removed)",
+    "mouseover@parent", "mousedown@parent", "mouseup@parent",
     "mouseout@parent", "mouseleave@parent"
   ]);
 </script>
diff --git a/pointerevents/pointerevent_after_target_removed_interleaved.tentative.html b/pointerevents/pointerevent_after_target_removed_interleaved.tentative.html
@@ -0,0 +1,128 @@
+<!DOCTYPE HTML>
+<!--
+   Tentative due to:
+   https://github.com/w3c/pointerevents/issues/492
+-->
+<title>
+  Enter/leave events fired to parent after child is removed
+  right before compat mouse-event
+</title>
+<meta name="variant" content="?mouse">
+<meta name="variant" content="?touch">
+<meta name="variant" content="?pen">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="pointerevent_support.js"></script>
+
+<style>
+  div.target {
+      width: 100px;
+      height: 100px;
+  }
+</style>
+<div class="target" id="parent">
+  <div class="target" id="child">child</div>
+</div>
+<div id="done">done</div>
+
+<script>
+  'use strict';
+  const pointer_type = location.search.substring(1);
+
+  const parent = document.getElementById("parent");
+  const child = document.getElementById("child");
+  const done = document.getElementById("done");
+
+  let event_log = [];
+  let logged_event_prefix = "";
+  let received_compat_mouse_events = false;
+
+  function logEvent(e) {
+    if (e.type.startsWith(logged_event_prefix) && e.eventPhase == e.AT_TARGET) {
+      event_log.push(e.type + "@" + e.target.id);
+    }
+    if (e.type.startsWith("mouse")) {
+      received_compat_mouse_events = true;
+    }
+  }
+
+  function removeChild() {
+    parent.removeChild(child);
+    event_log.push("(child-removed)");
+  }
+
+  function setup() {
+    const logged_event_suffixes =
+        ["over", "out", "enter", "leave", "down", "up"];
+    let targets = document.getElementsByClassName("target");
+    for (let i = 0; i < targets.length; i++) {
+      logged_event_suffixes.forEach(suffix => {
+        targets[i].addEventListener("pointer" + suffix, logEvent);
+        targets[i].addEventListener("mouse" + suffix, logEvent);
+      });
+      targets[i].addEventListener("click", logEvent);
+    }
+  }
+
+  function addPromiseTest(remover_event, tested_event_prefix, expected_events) {
+    const test_name = `${tested_event_prefix} events from ${pointer_type} `+
+          `received before/after child removal at ${remover_event}`;
+
+    promise_test(async test => {
+      event_log = [];
+      logged_event_prefix = tested_event_prefix;
+
+      child.addEventListener(remover_event, removeChild);
+      test.add_cleanup(() => {
+        child.removeEventListener(remover_event, removeChild);
+        if (!child.parentElement) {
+          parent.appendChild(child);
+        }
+      });
+
+      let done_click_promise = getEvent("click", done);
+
+      let actions = new test_driver.Actions()
+          .addPointer("TestPointer", pointer_type)
+          .pointerMove(-30, -30, {origin: parent})
+          .pointerDown()
+          .pointerUp()
+          .pointerMove(30, 30, {origin: parent})
+          .pointerDown()
+          .pointerUp()
+          .pointerMove(0, 0, {origin: done})
+          .pointerDown()
+          .pointerUp();
+
+      await actions.send();
+      await done_click_promise;
+
+      if (tested_event_prefix == "mouse" && !received_compat_mouse_events) {
+        expected_events = [];
+      }
+
+      assert_equals(event_log.toString(), expected_events.toString(),
+          "events received");
+    }, test_name);
+  }
+
+  setup();
+
+  // Tests for dispatched compatibility mouse events
+  // after DOM modification through pointer events.
+  addPromiseTest("pointerdown", "mouse", [
+    "mouseover@child", "mouseenter@parent", "mouseenter@child",
+    "(child-removed)", "mouseover@parent", "mousedown@parent", "mouseup@parent", "click@parent",
+    "mousedown@parent", "mouseup@parent", "click@parent",
+    "mouseout@parent", "mouseleave@parent"
+  ]);
+  addPromiseTest("pointerup", "mouse", [
+    "mouseover@child", "mouseenter@parent", "mouseenter@child",
+    "mousedown@child", "(child-removed)", "mouseover@parent", "mouseup@parent",  "click@parent",
+    "mousedown@parent", "mouseup@parent", "click@parent",
+    "mouseout@parent", "mouseleave@parent"
+  ]);
+</script>