summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/touch-events/single-touch.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
commit0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d (patch)
treea31f07c9bcca9d56ce61e9a1ffd30ef350d513aa /testing/web-platform/tests/touch-events/single-touch.html
parentInitial commit. (diff)
downloadfirefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.tar.xz
firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.zip
Adding upstream version 115.8.0esr.upstream/115.8.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/touch-events/single-touch.html')
-rw-r--r--testing/web-platform/tests/touch-events/single-touch.html392
1 files changed, 392 insertions, 0 deletions
diff --git a/testing/web-platform/tests/touch-events/single-touch.html b/testing/web-platform/tests/touch-events/single-touch.html
new file mode 100644
index 0000000000..4db96c208d
--- /dev/null
+++ b/testing/web-platform/tests/touch-events/single-touch.html
@@ -0,0 +1,392 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+ Test cases for Touch Events v1 Recommendation
+ http://www.w3.org/TR/touch-events/
+
+ These tests are based on Matt Bruebeck's single-touch tests.
+ There are NO multi-touch tests in this document.
+
+ This document references Test Assertions (abbrev TA below) written by Cathy Chan
+ http://www.w3.org/2010/webevents/wiki/TestAssertions
+-->
+
+<head>
+ <title>Touch Events Single Touch Tests</title>
+ <meta name="viewport" content="width=device-width">
+ <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>
+ setup({explicit_done: true});
+
+ // Check a Touch object's atttributes for existence and correct type
+ // TA: 1.1.2, 1.1.3
+ function check_Touch_object (t, element) {
+ test(function() {
+ assert_equals(Object.prototype.toString.call(t), "[object Touch]", name + " attribute of type TouchList");
+ }, element + "'s touch point is a Touch object");
+ [
+ ["long", "identifier"],
+ ["EventTarget", "target"],
+ ["long", "screenX"],
+ ["long", "screenY"],
+ ["long", "clientX"],
+ ["long", "clientY"],
+ ["long", "pageX"],
+ ["long", "pageY"],
+ ].forEach(function(attr) {
+ var type = attr[0];
+ var name = attr[1];
+
+ // existence check
+ test(function() {
+ assert_true(name in t, name + " attribute in Touch object");
+ }, element + ".Touch." + name + " attribute exists check_Touch_object");
+
+ // type check
+ switch(type) {
+ case "long":
+ test(function() {
+ assert_equals(typeof t[name], "number", name + " attribute of type long");
+ }, element + ".Touch." + name + " attribute is of type number (long)");
+ break;
+ case "EventTarget":
+ // An event target is some type of Element
+ test(function() {
+ assert_true(t[name] instanceof Element, "EventTarget must be an Element.");
+ }, element + ".Touch." + name + " attribute is of type Element");
+ break;
+ default:
+ break;
+ }
+ });
+ }
+
+ // Check a TouchList object's attributes and methods for existence and proper type
+ // Also make sure all of the members of the list are Touch objects
+ // TA: 1.2.1, 1.2.2, 1.2.5
+ function check_TouchList_object (tl, element) {
+ test(function() {
+ assert_equals(Object.prototype.toString.call(tl), "[object TouchList]", name + " attribute of type TouchList");
+ }, element + "'s touch list is a TouchList object");
+ [
+ ["unsigned long", "length"],
+ ["function", "item"],
+ ].forEach(function(attr) {
+ var type = attr[0];
+ var name = attr[1];
+
+ // existence check
+ test(function() {
+ assert_true(name in tl, name + " attribute in TouchList");
+ }, element + ".TouchList." + name + " attribute exists check_TouchList_object");
+
+ // type check
+ switch(type) {
+ case "unsigned long":
+ test(function() {
+ assert_equals(typeof tl[name], "number", name + " attribute of type long");
+ }, element + ".TouchList." + name + " attribute is of type number (unsigned long)");
+ break;
+ case "function":
+ test(function() {
+ assert_equals(typeof tl[name], "function", name + " attribute of type function");
+ }, element + ".TouchList." + name + " attribute is of type function");
+ break;
+ default:
+ break;
+ }
+ });
+ // Each member of tl should be a proper Touch object
+ for (var i=0; i < tl.length; i++) {
+ check_Touch_object(tl.item(i), element + "[" + i + "]");
+ }
+ }
+
+ // Check a TouchEvent event's attributes for existence and proper type
+ // Also check that each of the event's TouchList objects are valid
+ // TA: 1.{3,4,5}.1.1, 1.{3,4,5}.1.2
+ function check_TouchEvent(ev) {
+ test(function() {
+ assert_true(ev instanceof TouchEvent, "event is a TouchEvent event");
+ }, ev.type + " event is a TouchEvent event");
+ [
+ ["TouchList", "touches"],
+ ["TouchList", "targetTouches"],
+ ["TouchList", "changedTouches"],
+ ["boolean", "altKey"],
+ ["boolean", "metaKey"],
+ ["boolean", "ctrlKey"],
+ ["boolean", "shiftKey"],
+ ].forEach(function(attr) {
+ var type = attr[0];
+ var name = attr[1];
+
+ // existence check
+ test(function() {
+ assert_true(name in ev, name + " attribute in " + ev.type + " event");
+ }, ev.type + "." + name + " attribute exists check_TouchEvent");
+
+ // type check
+ switch(type) {
+ case "boolean":
+ test(function() {
+ assert_equals(typeof ev[name], "boolean", name + " attribute of type boolean");
+ }, ev.type + "." + name + " attribute is of type boolean");
+ break;
+ case "TouchList":
+ test(function() {
+ assert_equals(Object.prototype.toString.call(ev[name]), "[object TouchList]", name + " attribute of type TouchList");
+ }, ev.type + "." + name + " attribute is of type TouchList");
+ // Now check the validity of the TouchList
+ check_TouchList_object(ev[name], ev.type + "." + name);
+ break;
+ default:
+ break;
+ }
+ });
+ }
+
+ function is_touch_over_element(touch, element) {
+ var bounds = element.getBoundingClientRect();
+ return touch.pageX >= bounds.left && touch.pageX <= bounds.right &&
+ touch.pageY >= bounds.top && touch.pageY <= bounds.bottom;
+ }
+
+ function check_touch_clientXY(touch) {
+ assert_equals(touch.clientX, touch.pageX - window.pageXOffset, "touch.clientX is touch.pageX - window.pageXOffset.");
+ assert_equals(touch.clientY, touch.pageY - window.pageYOffset, "touch.clientY is touch.pageY - window.pageYOffset.");
+ }
+
+ function check_screenXY_clientXY_pageXY(touch) {
+ assert_greater_than_equal(touch.screenX, 0, "touch.screenX is no less than 0");
+ assert_greater_than_equal(touch.screenY, 0, "touch.screenY is no less than 0");
+ assert_greater_than_equal(touch.clientX, 0, "touch.clientX is no less than 0");
+ assert_greater_than_equal(touch.clientY, 0, "touch.clientY is no less than 0");
+ assert_greater_than_equal(touch.pageX, 0, "touch.pageX is no less than 0");
+ assert_greater_than_equal(touch.pageY, 0, "touch.pageY is no less than 0");
+ }
+
+ async function run() {
+ var target0 = document.getElementById("target0");
+ var target1 = document.getElementById("target1");
+
+ var test_touchstart = async_test("touchstart event received");
+ var test_touchmove = async_test("touchmove event received");
+ var test_touchend = async_test("touchend event received");
+ var test_mousedown = async_test("Interaction with mouse events");
+
+ var touchstart_received = false;
+ var touchmove_received = false;
+ var touchend_received = false;
+ var invalid_touchmove_received = false;
+ var touchstart_identifier;
+
+ on_event(target0, "touchstart", function onTouchStart(ev) {
+ ev.preventDefault();
+
+ // Check event ordering TA: 1.6.2
+ test_touchstart.step(function() {
+ assert_false(touchstart_received, "duplicate touchstart event");
+ assert_false(touchmove_received, "touchstart precedes touchmove");
+ assert_false(touchend_received, "touchstart precedes touchend");
+ });
+ test_touchstart.done();
+ if (touchstart_received)
+ return;
+ touchstart_received = true;
+ test_mousedown.done(); // If we got here, then the mouse event test is not needed.
+
+ check_TouchEvent(ev);
+
+ // TA: 1.3.2.1, 1.3.3.1, 1.3.4.1
+ test(function() {
+ assert_equals(ev.touches.length, 1, "One touch point.");
+ assert_equals(ev.changedTouches.length, 1, "One changed touch point.");
+ assert_equals(ev.targetTouches.length, 1, "One target touch point.");
+ }, "touchstart: all TouchList lengths are correct");
+
+ var t = ev.touches[0];
+ var ct = ev.changedTouches[0];
+ var tt = ev.targetTouches[0];
+
+ touchstart_identifier = t.identifier;
+ // TA: 1.3.3.3, 1.3.2.3, 1.3.3.4 (indirect (transitive))
+ test(function() {
+ assert_equals(ct.identifier, touchstart_identifier, "changedTouches identifier matches.");
+ assert_equals(tt.identifier, touchstart_identifier, "targetTouches identifier matches.");
+ }, "touchstart: all TouchList identifiers are consistent");
+
+ // TA: 1.3.3.9
+ test(function() {
+ assert_equals(tt.target, ev.target, "event target same as targetTouches target.");
+ }, "touchstart: event target same as targetTouches target");
+
+ test(function() {
+ assert_true(is_touch_over_element(t, target0), "touch.pageX/pageY is over target0.");
+ }, "touchstart: touch pageX/pageY inside of target element");
+ test(function() {
+ check_touch_clientXY(t);
+ }, "touchstart: touch clientX/clientY is consistent with pageX/pageY");
+ // Note we don't bother testing screenX/screenY values - there's no reliable way to
+ // verify they are consistent with clientX/clientY (due to unknown amount of window
+ // chrome), and also various forms of scaling mean they are in different units.
+
+ test(function() {
+ check_screenXY_clientXY_pageXY(t);
+ }, "touchstart: touch screenX/screenY pageX/pageY and clientX/clientY values are no less than 0");
+ });
+
+ on_event(target0, "touchmove", function ontouchmove(ev) {
+ ev.preventDefault();
+
+ if (touchmove_received)
+ return;
+ touchmove_received = true;
+
+ test_touchmove.step(function() {
+ assert_true(touchstart_received, "touchmove follows touchstart");
+ assert_false(touchend_received, "touchmove precedes touchend");
+ });
+ test_touchmove.done();
+
+ check_TouchEvent(ev);
+
+ // TA: 1.4.2.1, 1.4.3.1
+ test(function() {
+ assert_equals(ev.touches.length, 1, "One touch point.");
+ assert_equals(ev.changedTouches.length, 1, "One changed touch point.");
+ assert_equals(ev.targetTouches.length, 1, "One target touch point.");
+ }, "touchmove: all TouchList lengths are correct");
+
+ // 1.4.2.3, 1.4.3.3, 1.4.3.5, 1.4.4.3
+ test(function() {
+ assert_equals(ev.touches[0].identifier, touchstart_identifier, "Touch identifier matches.");
+ assert_equals(ev.changedTouches[0].identifier, touchstart_identifier, "Changed touch identifier matches.");
+ assert_equals(ev.targetTouches[0].identifier, touchstart_identifier, "Target touch identifier matches.");
+ }, "touchmove: all TouchList identifiers matches touchstart identifier");
+
+ // TA: 1.4.3.8
+ var tt = ev.targetTouches[0];
+ test(function() {
+ assert_equals(tt.target, ev.target, "event target same as targetTouches target.");
+ }, "touchmove: event target same as targetTouches target");
+
+ test(function() {
+ assert_true(is_touch_over_element(tt, target0) || is_touch_over_element(tt, target1),
+ "touch.pageX/pageY is over one of the targets.");
+ }, "touchmove: touch pageX/pageY inside of one of the target elements");
+ test(function() {
+ check_touch_clientXY(tt);
+ }, "touchmove: touch clientX/clientY is consistent with pageX/pageY");
+
+ test(function() {
+ check_screenXY_clientXY_pageXY(tt);
+ }, "touchmove: touch screenX/screenY pageX/pageY and clientX/clientY values are no less than 0");
+
+ });
+
+ on_event(target1, "touchmove", function onTouchMove(ev) {
+ invalid_touchmove_received = true;
+ });
+
+ on_event(window, "touchend", function ontouchend(ev) {
+ touchend_received = true;
+
+ test_touchend.step(function() {
+ assert_equals(ev.target, target0, "touchend is dispatched to the original target");
+ assert_true(touchstart_received, "touchend follows touchstart");
+ assert_true(touchmove_received, "touchend follows touchmove");
+ assert_false(invalid_touchmove_received, "touchmove dispatched to correct target");
+ });
+ test_touchend.done();
+
+ check_TouchEvent(ev);
+
+ // TA: 1.5.1.2, 1.5.3.1, 1.5.4.1
+ test(function() {
+ assert_equals(ev.touches.length, 0, "Zero touch points.");
+ assert_equals(ev.changedTouches.length, 1, "One changed touch point.");
+ assert_equals(ev.targetTouches.length, 0, "Zero target touch points.");
+ }, "touchend: all TouchList lengths are correct");
+
+ var t = ev.changedTouches[0];
+
+ // TA: 1.5.2.6, 1.5.2.3
+ test(function() {
+ assert_equals(t.identifier, touchstart_identifier, "changedTouches identifier matches.");
+ }, "touchend: touches identifier matches changedTouches identifier");
+
+ test(function() {
+ assert_true(is_touch_over_element(t, target1),
+ "touch.pageX/pageY is over target1.");
+ }, "touchend: touch pageX/pageY inside expected element");
+ test(function() {
+ check_touch_clientXY(t);
+ }, "touchend: touch clientX/clientY is consistent with pageX/pageY");
+
+ test(function() {
+ check_screenXY_clientXY_pageXY(t);
+ }, "touchend: touch screenX/screenY pageX/pageY and clientX/clientY values are no less than 0");
+
+ done();
+ });
+
+ on_event(target0, "mousedown", function onMouseDown(ev) {
+ test_mousedown.step(function() {
+ assert_true(touchstart_received,
+ "The touchstart event must be dispatched before any mouse " +
+ "events. (If this fails, it might mean that the user agent does " +
+ "not implement W3C touch events at all.)"
+ );
+ });
+ test_mousedown.done();
+
+ if (!touchstart_received) {
+ // Abort the tests. If touch events are not supported, then most of
+ // the other event handlers will never be called, and the test will
+ // time out with misleading results.
+ done();
+ }
+ });
+
+ await new test_driver.Actions()
+ .addPointer("touchPointer1", "touch")
+ .pointerMove(0, 0, {origin: target0, sourceName: "touchPointer1"})
+ .pointerDown({sourceName: "touchPointer1"})
+ .pointerMove(0, 10, {origin: target0, sourceName: "touchPointer1"})
+ .pointerMove(0, 0, {origin: target1, sourceName: "touchPointer1"})
+ .pointerUp({sourceName: "touchPointer1"})
+ .send();
+ }
+ </script>
+ <style>
+ div {
+ margin: 0em;
+ padding: 2em;
+ }
+ #target0 {
+ background: yellow;
+ border: 1px solid orange;
+ }
+ #target1 {
+ background: lightblue;
+ border: 1px solid blue;
+ }
+ </style>
+</head>
+<body onload="run()">
+ <h1>Touch Events: single-touch tests</h1>
+ <div id="target0">
+ Touch this box with one finger (or other pointing device)...
+ </div>
+ <div id="target1">
+ ...then drag to this box and lift your finger.
+ </div>
+ <div id="log"></div>
+</body>
+</html> \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-16 09:56:34 +0000