Fix pointerevent_after_target_removed.html event asserts.

This will fix the WPT as per recent PEWG discussion:
web-platform-tests/interop#380

Bug: 1147998
Change-Id: I6be0583fe1d09ec5234d1b4b318ad061212a7ac7
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4833318
Reviewed-by: Robert Flack <flackr@chromium.org>
Commit-Queue: Mustaq Ahmed <mustaq@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1193213}

pointerevents/pointerevent_after_target_removed.html

@@ -13,7 +13,7 @@
 <style>
   div.target {
       width: 100px;
-      height: 50px;
+      height: 100px;
   }
 </style>
 <div class="target" id="parent">
@@ -30,44 +30,54 @@
   const done = document.getElementById("done");
 
   let event_log = [];
-  let logged_event_prefix = "";
 
   function logEvent(e) {
-    if (e.type.startsWith(logged_event_prefix) && e.eventPhase == e.AT_TARGET)
-      event_log.push(e.type);
+    if (e.eventPhase == e.AT_TARGET) {
+      event_log.push(e.type + "@" + e.target.id);
+    }
+  }
+
+  function removeChild() {
+    parent.removeChild(child);
+    event_log.push("(child-removed)");
   }
 
   function setup() {
     const logged_events = [
       "pointerover", "pointerout", "pointerenter", "pointerleave",
-      "mouseover", "mouseout", "mouseenter", "mouseleave"
+      "pointerdown", "pointerup"
     ];
-    logged_events.forEach(ename => parent.addEventListener(ename, logEvent));
+    let targets = document.getElementsByClassName("target");
+    for (let i = 0; i < targets.length; i++) {
+      logged_events.forEach(ename => {
+        targets[i].addEventListener(ename, logEvent);
+      });
+    }
   }
 
-  function addPromiseTest(remover_event, tested_event_prefix) {
-    const test_name = `${tested_event_prefix} events from ${pointer_type} `+
-        `at parent after child is removed at ${remover_event}`;
-    const expected_events = ["enter", "over", "out", "leave"]
-        .map(suffix => tested_event_prefix + suffix);
+  function addPromiseTest(remover_event, expected_events) {
+    const test_name = `PointerEvents from ${pointer_type} `+
+        `received before/after child removal at ${remover_event}`;
 
-    promise_test(async () => {
+    promise_test(async test => {
       event_log = [];
-      logged_event_prefix = tested_event_prefix;
-
-      // Bring the child back if it was removed in the previous promise_test.
-      if (!child.parentElement)
-        parent.appendChild(child);
 
-      child.addEventListener(remover_event,
-          () => parent.removeChild(child),
-          { once:true });
+      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(0, 0, {origin: parent})
+          .pointerMove(-30, -30, {origin: parent})
+          .pointerDown()
+          .pointerUp()
+          .pointerMove(30, 30, {origin: parent})
           .pointerDown()
           .pointerUp()
           .pointerMove(0, 0, {origin: done})
@@ -78,13 +88,21 @@
       await done_click_promise;
 
       assert_equals(event_log.toString(), expected_events.toString(),
-          "received events");
+          "events received");
     }, test_name);
   }
 
   setup();
-  addPromiseTest("pointerdown", "pointer");
-  addPromiseTest("pointerdown", "mouse");
-  addPromiseTest("pointerup", "pointer");
-  addPromiseTest("pointerup", "mouse");
+  addPromiseTest("pointerdown", [
+    "pointerover@child", "pointerenter@parent", "pointerenter@child",
+    "pointerdown@child", "(child-removed)", "pointerup@parent",
+    "pointerdown@parent", "pointerup@parent",
+    "pointerout@parent", "pointerleave@parent"
+  ]);
+  addPromiseTest("pointerup", [
+    "pointerover@child", "pointerenter@parent", "pointerenter@child",
+    "pointerdown@child", "pointerup@child", "(child-removed)",
+    "pointerdown@parent", "pointerup@parent",
+    "pointerout@parent", "pointerleave@parent"
+  ]);
 </script>