summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/pointerevents/compat
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:14:29 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:14:29 +0000
commitfbaf0bb26397aa498eb9156f06d5a6fe34dd7dd8 (patch)
tree4c1ccaf5486d4f2009f9a338a98a83e886e29c97 /testing/web-platform/tests/pointerevents/compat
parentReleasing progress-linux version 124.0.1-1~progress7.99u1. (diff)
downloadfirefox-fbaf0bb26397aa498eb9156f06d5a6fe34dd7dd8.tar.xz
firefox-fbaf0bb26397aa498eb9156f06d5a6fe34dd7dd8.zip
Merging upstream version 125.0.1.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/pointerevents/compat')
-rw-r--r--testing/web-platform/tests/pointerevents/compat/pointerevent_touch_target_after_pointerdown_target_removed.tentative.html281
1 files changed, 281 insertions, 0 deletions
diff --git a/testing/web-platform/tests/pointerevents/compat/pointerevent_touch_target_after_pointerdown_target_removed.tentative.html b/testing/web-platform/tests/pointerevents/compat/pointerevent_touch_target_after_pointerdown_target_removed.tentative.html
new file mode 100644
index 0000000000..124133d25c
--- /dev/null
+++ b/testing/web-platform/tests/pointerevents/compat/pointerevent_touch_target_after_pointerdown_target_removed.tentative.html
@@ -0,0 +1,281 @@
+<!doctype html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>Compatibility mapping with touch events after removing pointerdown target</title>
+<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>
+<style>
+div {
+ min-height: 32px;
+}
+</style>
+<script>
+"use strict";
+
+addEventListener("load", () => {
+ const checkEvents = [
+ "touchstart",
+ "touchmove",
+ "touchend",
+ "touchcancel",
+ "pointerdown",
+ "pointermove",
+ "pointerup",
+ "click",
+ ];
+ let events = [];
+ function log(event) {
+ events.push({type: event.type, target: event.target});
+ }
+ for (const type of checkEvents) {
+ addEventListener(type, log, {capture: true});
+ }
+ function stringifyEvent(event) {
+ return `{ type: ${event.type}, target: ${format_value(event.target)} }`;
+ }
+ function stringifyEvents(events) {
+ if (!events.length) {
+ return "[]";
+ }
+ let result = "";
+ for (const event of events) {
+ if (result === "") {
+ result = "[ ";
+ } else {
+ result += ", ";
+ }
+ result += stringifyEvent(event);
+ }
+ result += " ]";
+ return result;
+ }
+ function ignoreEvents(events, ignoringEvents) {
+ let ret = [];
+ for (const event of events) {
+ if (!ignoringEvents.includes(event.type)) {
+ ret.push(event);
+ }
+ }
+ return ret;
+ }
+
+ /**
+ * The event target of touch events should be dispatched at dispatching the
+ * preceding `pointerdown`. Then, even after the `pointerdown` target is
+ * removed from the DOM tree, following touch events should be fired on it.
+ * However, following pointer events should be fired at the event targets
+ * under the pointer.
+ */
+
+ for (const removerType of ["pointerdown", "touchstart"]) {
+ promise_test(
+ async t => {
+ const pointerDownTarget = document.createElement("div");
+ pointerDownTarget.id = "pointerDownTarget";
+ const pointerDownTargetParent = document.createElement("div");
+ pointerDownTargetParent.id = "pointerDownTargetParent";
+ pointerDownTargetParent.appendChild(pointerDownTarget);
+ document.body.appendChild(pointerDownTargetParent);
+ const pointerDownTargetRect = pointerDownTarget.getBoundingClientRect();
+
+ events = [];
+ pointerDownTarget.addEventListener(removerType, () => {
+ pointerDownTarget.remove();
+ // Keep listening to the events on the removed target node.
+ for (const type of ["touchstart", "touchmove", "touchend"]) {
+ pointerDownTarget.addEventListener(type, log, {capture: true});
+ }
+ }, {once: true});
+ await new test_driver.Actions()
+ .addPointer("touchPointer", "touch")
+ .setPointer("touchPointer")
+ .pointerMove(pointerDownTargetRect.left + 10, pointerDownTargetRect.top + 10)
+ .pointerDown()
+ .pointerMove(pointerDownTargetRect.left + 12, pointerDownTargetRect.top + 12)
+ .pointerUp()
+ .send();
+
+ const expectedEvents = [
+ { type: "pointerdown", target: pointerDownTarget },
+ { type: "touchstart", target: pointerDownTarget },
+ { type: "pointermove", target: pointerDownTargetParent },
+ { type: "touchmove", target: pointerDownTarget },
+ { type: "pointerup", target: pointerDownTargetParent },
+ { type: "touchend", target: pointerDownTarget },
+ { type: "click", target: pointerDownTargetParent },
+ ];
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["click", "touchmove"])),
+ stringifyEvents(ignoreEvents(expectedEvents, ["click", "touchmove"]))
+ )
+ },
+ `${
+ t.name
+ }, touch events should be fired on the touchstart target even though an orphan and pointer events should be fired on the parent`
+ );
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["touchmove"])),
+ stringifyEvents(ignoreEvents(expectedEvents, ["touchmove"]))
+ )
+ },
+ `${t.name}, click event should be fired on the pointerdown target parent`
+ );
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["click"])),
+ stringifyEvents(ignoreEvents(expectedEvents, ["click"]))
+ )
+ },
+ `${t.name}, touchmove event should be fired on the pointerdown target`
+ );
+ document.body.innerHTML = "";
+ },
+ `After a ${removerType} listener removes its target`
+ );
+
+ promise_test(
+ async t => {
+ const pointerDownTarget = document.createElement("div");
+ pointerDownTarget.id = "pointerDownTarget";
+ const pointerDownTargetParent = document.createElement("div");
+ pointerDownTargetParent.id = "pointerDownTargetParent";
+ pointerDownTargetParent.appendChild(pointerDownTarget);
+ document.body.appendChild(pointerDownTargetParent);
+ const pointerDownTargetRect = pointerDownTarget.getBoundingClientRect();
+
+ events = [];
+ pointerDownTarget.addEventListener(removerType, () => {
+ pointerDownTarget.remove();
+ pointerDownTargetParent.appendChild(pointerDownTarget);
+ }, {once: true});
+ await new test_driver.Actions()
+ .addPointer("touchPointer", "touch")
+ .setPointer("touchPointer")
+ .pointerMove(pointerDownTargetRect.left + 10, pointerDownTargetRect.top + 10)
+ .pointerDown()
+ .pointerMove(pointerDownTargetRect.left + 12, pointerDownTargetRect.top + 12)
+ .pointerUp()
+ .send();
+
+ const expectedEvents = [
+ { type: "pointerdown", target: pointerDownTarget },
+ { type: "touchstart", target: pointerDownTarget },
+ { type: "pointermove", target: pointerDownTarget },
+ { type: "touchmove", target: pointerDownTarget },
+ { type: "pointerup", target: pointerDownTarget },
+ { type: "touchend", target: pointerDownTarget },
+ { type: "click", target: pointerDownTarget },
+ ];
+
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["click", "touchmove"])),
+ stringifyEvents(ignoreEvents(events, ["click", "touchmove"])),
+ )
+ },
+ `${t.name}, touch events and pointer events should be fired on the pointerdown target`
+ );
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["touchmove"])),
+ stringifyEvents(ignoreEvents(events, ["touchmove"])),
+ )
+ },
+ `${t.name}, click event should be fired on the pointerdown target`
+ );
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["click"])),
+ stringifyEvents(ignoreEvents(events, ["click"])),
+ )
+ },
+ `${t.name}, touchmove event should be fired on the pointerdown target`
+ );
+ document.body.innerHTML = "";
+ },
+ `After a ${removerType} listener removes but appends the target to same position again`
+ );
+
+ promise_test(
+ async t => {
+ const pointerDownTarget = document.createElement("div");
+ pointerDownTarget.id = "pointerDownTarget";
+ const pointerDownTargetParent = document.createElement("div");
+ pointerDownTargetParent.id = "pointerDownTargetParent";
+ pointerDownTargetParent.appendChild(pointerDownTarget);
+ document.body.appendChild(pointerDownTargetParent);
+ const pointerDownTargetRect = pointerDownTarget.getBoundingClientRect();
+
+ events = [];
+ pointerDownTarget.addEventListener(removerType, () => {
+ pointerDownTarget.remove();
+ document.body.appendChild(pointerDownTarget);
+ }, {once: true});
+ await new test_driver.Actions()
+ .addPointer("touchPointer", "touch")
+ .setPointer("touchPointer")
+ .pointerMove(pointerDownTargetRect.left + 10, pointerDownTargetRect.top + 10)
+ .pointerDown()
+ .pointerMove(pointerDownTargetRect.left + 12, pointerDownTargetRect.top + 12)
+ .pointerUp()
+ .send();
+
+ const expectedEvents = [
+ { type: "pointerdown", target: pointerDownTarget },
+ { type: "touchstart", target: pointerDownTarget },
+ { type: "pointermove", target: pointerDownTargetParent },
+ { type: "touchmove", target: pointerDownTarget },
+ { type: "pointerup", target: pointerDownTargetParent },
+ { type: "touchend", target: pointerDownTarget },
+ { type: "click", target: pointerDownTargetParent },
+ ];
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["click", "touchmove"])),
+ stringifyEvents(ignoreEvents(expectedEvents, ["click", "touchmove"]))
+ )
+ },
+ `${
+ t.name
+ }, touch events should be fired on the pointerdown target, but pointer events should be fired on the pointerdown target parent`
+ );
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["touchmove"])),
+ stringifyEvents(ignoreEvents(expectedEvents, ["touchmove"]))
+ )
+ },
+ `${t.name}, click event should be fired on the pointerdown target parent`
+ );
+ test(
+ () => {
+ assert_equals(
+ stringifyEvents(ignoreEvents(events, ["click"])),
+ stringifyEvents(ignoreEvents(expectedEvents, ["click"]))
+ )
+ },
+ `${t.name}, touchmove event should be fired on the pointerdown target parent`
+ );
+ document.body.innerHTML = "";
+ },
+ `After a ${removerType} listener moves the target to different position`
+ );
+ }
+}, {once: true});
+</script>
+<body></body>
+</html>