diff options
Diffstat (limited to 'dom/events/test/pointerevents')
143 files changed, 9330 insertions, 0 deletions
diff --git a/dom/events/test/pointerevents/bug1293174_implicit_pointer_capture_for_touch_1.html b/dom/events/test/pointerevents/bug1293174_implicit_pointer_capture_for_touch_1.html new file mode 100644 index 000000000..cd5c2b36e --- /dev/null +++ b/dom/events/test/pointerevents/bug1293174_implicit_pointer_capture_for_touch_1.html @@ -0,0 +1,64 @@ +<!doctype html> +<html> + <head> + <title>Pointer Events properties tests</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("implicit pointer capture for touch"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + let target0 = window.document.getElementById("target0"); + let target1 = window.document.getElementById("target1"); + + on_event(target0, "pointerdown", function (event) { + pointerdown_event = event; + detected_pointertypes[event.pointerType] = true; + assert_true(true, "target0 receives pointerdown"); + }); + + on_event(target0, "pointermove", function (event) { + assert_true(true, "target0 receives pointermove"); + assert_true(target0.hasPointerCapture(event.pointerId), "target0.hasPointerCapture should be true"); + }); + + on_event(target0, "gotpointercapture", function (event) { + assert_true(true, "target0 should receive gotpointercapture"); + }); + + on_event(target0, "lostpointercapture", function (event) { + assert_true(true, "target0 should receive lostpointercapture"); + }); + + on_event(target1, "pointermove", function (event) { + assert_true(false, "target1 should not receive pointermove"); + }); + + on_event(target0, "pointerup", function (event) { + assert_true(true, "target0 receives pointerup"); + test_pointerEvent.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Events tests</h1> + <div id="target0" style="width: 200px; height: 200px; background: green" touch-action:none></div> + <div id="target1" style="width: 200px; height: 200px; background: green" touch-action:none></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/bug1293174_implicit_pointer_capture_for_touch_2.html b/dom/events/test/pointerevents/bug1293174_implicit_pointer_capture_for_touch_2.html new file mode 100644 index 000000000..e84faacf6 --- /dev/null +++ b/dom/events/test/pointerevents/bug1293174_implicit_pointer_capture_for_touch_2.html @@ -0,0 +1,65 @@ +<!doctype html> +<html> + <head> + <title>Pointer Events properties tests</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("implicit pointer capture for touch"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + let target0 = window.document.getElementById("target0"); + let target1 = window.document.getElementById("target1"); + + on_event(target0, "pointerdown", function (event) { + pointerdown_event = event; + detected_pointertypes[event.pointerType] = true; + assert_true(true, "target0 receives pointerdown"); + }); + + on_event(target0, "pointermove", function (event) { + assert_true(true, "target0 receives pointermove"); + assert_false(target0.hasPointerCapture(event.pointerId), "target0.hasPointerCapture should be false"); + }); + + on_event(target0, "gotpointercapture", function (event) { + assert_unreached("target0 should not receive gotpointercapture"); + }); + + on_event(target0, "lostpointercapture", function (event) { + assert_unreached("target0 should not receive lostpointercapture"); + }); + + on_event(target1, "pointermove", function (event) { + assert_true(true, "target1 receives pointermove"); + assert_false(target1.hasPointerCapture(), "target1.hasPointerCapture should be false"); + }); + + on_event(target0, "pointerup", function (event) { + assert_true(true, "target0 receives pointerup"); + test_pointerEvent.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Events tests</h1> + <div id="target0" style="width: 200px; height: 200px; background: green" touch-action:none></div> + <div id="target1" style="width: 200px; height: 200px; background: green" touch-action:none></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/mochitest.ini b/dom/events/test/pointerevents/mochitest.ini new file mode 100644 index 000000000..58eae12fe --- /dev/null +++ b/dom/events/test/pointerevents/mochitest.ini @@ -0,0 +1,152 @@ +[DEFAULT] +skip-if = os == 'android' # Bug 1312791 +support-files = + mochitest_support_external.js + mochitest_support_internal.js + pointerevent_styles.css + pointerevent_support.js + +[test_pointerevent_attributes_mouse-manual.html] + support-files = pointerevent_attributes_mouse-manual.html +[test_pointerevent_capture_mouse-manual.html] + support-files = pointerevent_capture_mouse-manual.html +[test_pointerevent_capture_suppressing_mouse-manual.html] + support-files = pointerevent_capture_suppressing_mouse-manual.html +[test_pointerevent_change-touch-action-onpointerdown_touch-manual.html] + support-files = pointerevent_change-touch-action-onpointerdown_touch-manual.html + disabled = disabled +[test_pointerevent_constructor.html] + support-files = pointerevent_constructor.html +[test_pointerevent_element_haspointercapture-manual.html] + support-files = pointerevent_element_haspointercapture-manual.html +[test_pointerevent_element_haspointercapture_release_pending_capture-manual.html] + support-files = pointerevent_element_haspointercapture_release_pending_capture-manual.html +[test_pointerevent_gotpointercapture_before_first_pointerevent-manual.html] + support-files = pointerevent_gotpointercapture_before_first_pointerevent-manual.html +[test_pointerevent_lostpointercapture_for_disconnected_node-manual.html] + support-files = pointerevent_lostpointercapture_for_disconnected_node-manual.html +[test_pointerevent_lostpointercapture_is_first-manual.html] + support-files = pointerevent_lostpointercapture_is_first-manual.html +[test_pointerevent_multiple_primary_pointers_boundary_events-manual.html] + support-files = pointerevent_multiple_primary_pointers_boundary_events-manual.html + disabled = should be investigated +[test_pointerevent_pointercancel_touch-manual.html] + support-files = pointerevent_pointercancel_touch-manual.html +[test_pointerevent_pointerdown-manual.html] + support-files = pointerevent_pointerdown-manual.html +[test_pointerevent_pointerenter_does_not_bubble-manual.html] + support-files = pointerevent_pointerenter_does_not_bubble-manual.html +[test_pointerevent_pointerenter_nohover-manual.html] + support-files = pointerevent_pointerenter_nohover-manual.html +[test_pointerevent_pointerId_scope-manual.html] + support-files = + test_pointerevent_pointerId_scope-manual.html + ./resources/pointerevent_pointerId_scope-iframe.html + disabled = should be investigated +[test_pointerevent_pointerenter-manual.html] + support-files = pointerevent_pointerenter-manual.html +[test_pointerevent_pointerleave_after_pointercancel_touch-manual.html] + support-files = pointerevent_pointerleave_after_pointercancel_touch-manual.html +[test_pointerevent_pointerleave_after_pointerup_nohover-manual.html] + support-files = pointerevent_pointerleave_after_pointerup_nohover-manual.html +[test_pointerevent_pointerleave_descendant_over-manual.html] + support-files = pointerevent_pointerleave_descendant_over-manual.html +[test_pointerevent_pointerleave_descendants-manual.html] + support-files = pointerevent_pointerleave_descendants-manual.html +[test_pointerevent_pointerleave_does_not_bubble-manual.html] + support-files = pointerevent_pointerleave_does_not_bubble-manual.html +[test_pointerevent_pointerleave_mouse-manual.html] + support-files = pointerevent_pointerleave_mouse-manual.html +[test_pointerevent_pointerleave_pen-manual.html] + support-files = pointerevent_pointerleave_pen-manual.html +[test_pointerevent_pointerleave_touch-manual.html] + support-files = pointerevent_pointerleave_touch-manual.html +[test_pointerevent_pointermove-manual.html] + support-files = pointerevent_pointermove-manual.html +[test_pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html] + support-files = pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html +[test_pointerevent_pointermove-on-chorded-mouse-button.html] + support-files = pointerevent_pointermove-on-chorded-mouse-button.html +[test_pointerevent_pointermove_pointertype-manual.html] + support-files = pointerevent_pointermove_pointertype-manual.html +[test_pointerevent_pointerout-manual.html] + support-files = pointerevent_pointerout-manual.html +[test_pointerevent_pointerout_after_pointercancel_touch-manual.html] + support-files = pointerevent_pointerout_after_pointercancel_touch-manual.html +[test_pointerevent_pointerout_after_pointerup_nohover-manual.html] + support-files = pointerevent_pointerout_after_pointerup_nohover-manual.html +[test_pointerevent_pointerout_pen-manual.html] + support-files = pointerevent_pointerout_pen-manual.html +[test_pointerevent_pointerout_received_once-manual.html] + support-files = pointerevent_pointerout_received_once-manual.html +[test_pointerevent_pointerover-manual.html] + support-files = pointerevent_pointerover-manual.html +[test_pointerevent_pointertype_mouse-manual.html] + support-files = pointerevent_pointertype_mouse-manual.html +[test_pointerevent_pointertype_pen-manual.html] + support-files = pointerevent_pointertype_pen-manual.html +[test_pointerevent_pointertype_touch-manual.html] + support-files = pointerevent_pointertype_touch-manual.html +[test_pointerevent_pointerup-manual.html] + support-files = pointerevent_pointerup-manual.html +[test_pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html] + support-files = pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html +[test_pointerevent_pointerup_pointertype-manual.html] + support-files = pointerevent_pointerup_pointertype-manual.html +[test_pointerevent_releasepointercapture_events_to_original_target-manual.html] + support-files = pointerevent_releasepointercapture_events_to_original_target-manual.html +[test_pointerevent_releasepointercapture_invalid_pointerid-manual.html] + support-files = pointerevent_releasepointercapture_invalid_pointerid-manual.html +[test_pointerevent_releasepointercapture_onpointercancel_touch-manual.html] + support-files = pointerevent_releasepointercapture_onpointercancel_touch-manual.html +[test_pointerevent_releasepointercapture_onpointerup_mouse-manual.html] + support-files = pointerevent_releasepointercapture_onpointerup_mouse-manual.html +[test_pointerevent_releasepointercapture_release_right_after_capture-manual.html] + support-files = pointerevent_releasepointercapture_release_right_after_capture-manual.html +[test_pointerevent_setpointercapture_disconnected-manual.html] + support-files = pointerevent_setpointercapture_disconnected-manual.html +[test_pointerevent_setpointercapture_inactive_button_mouse-manual.html] + support-files = pointerevent_setpointercapture_inactive_button_mouse-manual.html + disabled = should be investigated +[test_pointerevent_setpointercapture_invalid_pointerid-manual.html] + support-files = pointerevent_setpointercapture_invalid_pointerid-manual.html +[test_pointerevent_setpointercapture_override_pending_capture_element-manual.html] + support-files = pointerevent_setpointercapture_override_pending_capture_element-manual.html +[test_pointerevent_setpointercapture_relatedtarget-manual.html] + support-files = pointerevent_setpointercapture_relatedtarget-manual.html +[test_pointerevent_setpointercapture_to_same_element_twice-manual.html] + support-files = pointerevent_setpointercapture_to_same_element_twice-manual.html +[test_pointerevent_suppress_compat_events_on_click.html] + support-files = pointerevent_suppress_compat_events_on_click.html + disabled = should be investigated +[test_pointerevent_suppress_compat_events_on_drag_mouse.html] + support-files = pointerevent_suppress_compat_events_on_drag_mouse.html + disabled = should be investigated +[test_touch_action.html] + support-files = + ../../../../gfx/layers/apz/test/mochitest/apz_test_utils.js + ../../../../gfx/layers/apz/test/mochitest/apz_test_native_event_utils.js + touch_action_helpers.js + pointerevent_touch-action-auto-css_touch-manual.html + pointerevent_touch-action-button-test_touch-manual.html + pointerevent_touch-action-inherit_child-auto-child-none_touch-manual.html + pointerevent_touch-action-inherit_child-none_touch-manual.html + pointerevent_touch-action-inherit_child-pan-x-child-pan-x_touch-manual.html + pointerevent_touch-action-inherit_child-pan-x-child-pan-y_touch-manual.html + pointerevent_touch-action-inherit_highest-parent-none_touch-manual.html + pointerevent_touch-action-inherit_parent-none_touch-manual.html + pointerevent_touch-action-none-css_touch-manual.html + pointerevent_touch-action-pan-x-css_touch-manual.html + pointerevent_touch-action-pan-x-pan-y-pan-y_touch-manual.html + pointerevent_touch-action-pan-x-pan-y_touch-manual.html + pointerevent_touch-action-pan-y-css_touch-manual.html + pointerevent_touch-action-span-test_touch-manual.html + pointerevent_touch-action-svg-test_touch-manual.html + pointerevent_touch-action-table-test_touch-manual.html +[test_bug1285128.html] +[test_bug1293174_implicit_pointer_capture_for_touch_1.html] + support-files = bug1293174_implicit_pointer_capture_for_touch_1.html +[test_bug1293174_implicit_pointer_capture_for_touch_2.html] + support-files = bug1293174_implicit_pointer_capture_for_touch_2.html +[test_empty_file.html] + disabled = disabled # Bug 1150091 - Issue with support-files diff --git a/dom/events/test/pointerevents/mochitest_support_external.js b/dom/events/test/pointerevents/mochitest_support_external.js new file mode 100644 index 000000000..01c340728 --- /dev/null +++ b/dom/events/test/pointerevents/mochitest_support_external.js @@ -0,0 +1,123 @@ +// This file supports translating W3C tests +// to tests on auto MochiTest system with minimum changes. +// Author: Maksim Lebedev <alessarik@gmail.com> + +// Function allows to prepare our tests after load document +addEventListener("load", function(event) { + console.log("OnLoad external document"); + prepareTest(); +}, false); + +// Function allows to initialize prerequisites before testing +function prepareTest() { + SimpleTest.waitForExplicitFinish(); + SimpleTest.requestCompleteLog(); + turnOnPointerEvents(startTest); +} + +function setImplicitPointerCapture(capture, callback) { + console.log("SET dom.w3c_pointer_events.implicit_capture as " + capture); + SpecialPowers.pushPrefEnv({ + "set": [ + ["dom.w3c_pointer_events.implicit_capture", capture] + ] + }, callback); +} + +function turnOnPointerEvents(callback) { + console.log("SET dom.w3c_pointer_events.enabled as TRUE"); + console.log("SET layout.css.touch_action.enabled as TRUE"); + SpecialPowers.pushPrefEnv({ + "set": [ + ["dom.w3c_pointer_events.enabled", true], + ["layout.css.touch_action.enabled", true] + ] + }, callback); +} + +// Helper function to send MouseEvent with different parameters +function sendMouseEvent(int_win, elemId, mouseEventType, params) { + var elem = int_win.document.getElementById(elemId); + if(!!elem) { + var rect = elem.getBoundingClientRect(); + var eventObj = {type: mouseEventType}; + if(params && "button" in params) + eventObj.button = params.button; + if(params && "inputSource" in params) + eventObj.inputSource = params.inputSource; + if(params && "buttons" in params) + eventObj.buttons = params.buttons; + + // Default to the center of the target element but we can still send to a + // position outside of the target element. + var offsetX = params && "offsetX" in params ? params.offsetX : rect.width / 2; + var offsetY = params && "offsetY" in params ? params.offsetY : rect.height / 2; + + console.log(elemId, eventObj); + synthesizeMouse(elem, offsetX, offsetY, eventObj, int_win); + + } else { + is(!!elem, true, "Document should have element with id: " + elemId); + } +} + +// Helper function to send TouchEvent with different parameters +function sendTouchEvent(int_win, elemId, touchEventType, params) { + var elem = int_win.document.getElementById(elemId); + if(!!elem) { + var rect = elem.getBoundingClientRect(); + var eventObj = {type: touchEventType}; + + // Default to the center of the target element but we can still send to a + // position outside of the target element. + var offsetX = params && "offsetX" in params ? params.offsetX : rect.width / 2; + var offsetY = params && "offsetY" in params ? params.offsetY : rect.height / 2; + + console.log(elemId, eventObj); + synthesizeTouch(elem, offsetX, offsetY, eventObj, int_win); + } else { + is(!!elem, true, "Document should have element with id: " + elemId); + } +} + +// Helper function to run Point Event test in a new tab. +function runTestInNewWindow(aFile) { + var w = window.open('', "_blank"); + w.is = function(a, b, msg) { return is(a, b, aFile + " | " + msg); }; + w.ok = function(cond, name, diag) { return ok(cond, aFile + " | " + name, diag); }; + w.location = location.href.substring(0, location.href.lastIndexOf('/') + 1) + aFile; + + w.testContext = { + result_callback: (aTestObj) => { + if(aTestObj["status"] != aTestObj["PASS"]) { + console.log(aTestObj["status"] + " = " + aTestObj["PASS"] + ". " + aTestObj["name"]); + } + is(aTestObj["status"], aTestObj["PASS"], aTestObj["name"]); + }, + + completion_callback: () => { + if (!!w.testContext.executionPromise) { + // We need to wait tests done and execute finished then we can close the window + w.testContext.executionPromise.then(() => { + w.close(); + SimpleTest.finish(); + }); + } else { + // execute may synchronous trigger tests done. In that case executionPromise + // is not yet assigned + w.close(); + SimpleTest.finish(); + } + }, + + execute: (aWindow) => { + turnOnPointerEvents(() => { + w.testContext.executionPromise = new Promise((aResolve, aReject) => { + executeTest(aWindow); + aResolve(); + }); + }); + } + }; + return w; +} diff --git a/dom/events/test/pointerevents/mochitest_support_internal.js b/dom/events/test/pointerevents/mochitest_support_internal.js new file mode 100644 index 000000000..f8161362c --- /dev/null +++ b/dom/events/test/pointerevents/mochitest_support_internal.js @@ -0,0 +1,31 @@ +// This file supports translating W3C tests +// to tests on auto MochiTest system with minimum changes. +// Author: Maksim Lebedev <alessarik@gmail.com> + +// Function allows to prepare our tests after load document +addEventListener("load", function(event) { + console.log("OnLoad internal document"); + addListeners(document.getElementById("target0")); + addListeners(document.getElementById("target1")); + preExecute(); +}, false); + +// Function allows to initialize prerequisites before testing +// and adds some callbacks to support mochitest system. +function preExecute() { + add_result_callback(testContext.result_callback); + add_completion_callback(testContext.completion_callback); + testContext.execute(window); +} + +function addListeners(elem) { + if(!elem) + return; + var All_Events = ["pointerdown","pointerup","pointercancel","pointermove","pointerover","pointerout", + "pointerenter","pointerleave","gotpointercapture","lostpointercapture"]; + All_Events.forEach(function(name) { + elem.addEventListener(name, function(event) { + console.log('('+event.type+')-('+event.pointerType+')'); + }, false); + }); +} diff --git a/dom/events/test/pointerevents/pointerevent_attributes_mouse-manual.html b/dom/events/test/pointerevents/pointerevent_attributes_mouse-manual.html new file mode 100644 index 000000000..a54e79911 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_attributes_mouse-manual.html @@ -0,0 +1,113 @@ +<!doctype html> +<html> + <head> + <title>Pointer Events properties tests</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script> + var detected_pointertypes = {}; + var detected_eventTypes = {}; + var test_pointerEvent = async_test("pointerevent attributes"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var square1 = document.getElementById("square1"); + var rectSquare1 = square1.getBoundingClientRect(); + var pointerover_event; + + var eventList = ['pointerenter', 'pointerover', 'pointermove', 'pointerdown', 'pointerup', 'pointerout', 'pointerleave']; + eventList.forEach(function(eventName) { + on_event(square1, eventName, function (event) { + if (detected_eventTypes[event.type]) + return; + detected_pointertypes[event.pointerType] = true; + test(function () { + assert_equals(event.pointerType, 'mouse', 'pointerType should be mouse'); + }, event.type + ".pointerType attribute is correct."); + + // Test button and buttons + if (event.type == 'pointerdown') { + test(function() { + assert_true(event.button == 0, "If left mouse button is pressed button attribute is 0") + }, event.type + "'s button attribute is 0 when left mouse button is pressed."); + test(function() { + assert_true(event.buttons == 1, "If left mouse button is pressed buttons attribute is 1") + }, event.type + "'s buttons attribute is 1 when left mouse button is pressed."); + } else if (event.type == 'pointerup') { + test(function() { + assert_true(event.button == 0, "If left mouse button is just released button attribute is 0") + }, event.type + "'s button attribute is 0 when left mouse button is just released."); + test(function() { + assert_true(event.buttons == 0, "If left mouse button is just released buttons attribute is 0") + }, event.type + "'s buttons attribute is 0 when left mouse button is just released."); + } else { + test(function() { + assert_true(event.button == -1, "If mouse buttons are released button attribute is -1") + }, event.type + "'s button is -1 when mouse buttons are released."); + test(function() { + assert_true(event.buttons == 0, "If mouse buttons are released buttons attribute is 0") + }, event.type + "'s buttons is 0 when mouse buttons are released."); + } + + // Test clientX and clientY + if (event.type != 'pointerout' && event.type != 'pointerleave' ) { + test(function () { + assert_true(event.clientX >= rectSquare1.left && event.clientX < rectSquare1.right, "ClientX should be in the boundaries of the black box"); + }, event.type + ".clientX attribute is correct."); + test(function () { + assert_true(event.clientY >= rectSquare1.top && event.clientY < rectSquare1.bottom, "ClientY should be in the boundaries of the black box"); + }, event.type + ".clientY attribute is correct."); + } else { + test(function () { + assert_true(event.clientX < rectSquare1.left || event.clientX > rectSquare1.right - 1 || event.clientY < rectSquare1.top || event.clientY > rectSquare1.bottom - 1, "ClientX/Y should be out of the boundaries of the black box"); + }, event.type + "'s ClientX and ClientY attributes are correct."); + } + + // Test isPrimary + test(function () { + assert_equals(event.isPrimary, true, "isPrimary should be true"); + }, event.type + ".isPrimary attribute is correct."); + + // Test width and height + test(function () { + assert_equals(event.width, 1, "width of mouse should be 1"); + }, event.type + ".width attribute is correct."); + test(function () { + assert_equals(event.height, 1, "height of mouse should be 1"); + }, event.type + ".height attribute is correct."); + + check_PointerEvent(event); + detected_eventTypes[event.type] = true; + if (Object.keys(detected_eventTypes).length == eventList.length) + test_pointerEvent.done(); + }); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Events pointerdown tests</h1> + <!-- + <h4> + Test Description: This test checks the properties of mouse pointer events. Move your mouse over the black square and click on it. Then move it off the black square. + </h4> + --> + Test passes if the proper behavior of the events is observed. + <div id="square1" class="square"></div> + <div class="spacer"></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html> + diff --git a/dom/events/test/pointerevents/pointerevent_capture_mouse-manual.html b/dom/events/test/pointerevents/pointerevent_capture_mouse-manual.html new file mode 100644 index 000000000..63e8af777 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_capture_mouse-manual.html @@ -0,0 +1,135 @@ +<!doctype html> +<html> + <head> + <title>Set/Release capture</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body> + <!-- + <h1>Pointer Events capture test</h1> + <h4> + Test Description: This test checks if setCapture/releaseCapture functions works properly. Complete the following actions: + <ol> + <li> Move your mouse over the black rectangle. pointermove event should be logged in the black rectangle</li> + <li> Move your mouse over the purple rectangle. pointerover event should be logged in the purple rectangle</li> + <li> Press and hold left mouse button over "Set Capture" button. "gotpointercapture" should be logged in the black rectangle</li> + <li> Move your mouse anywhere. pointermove should be logged in the black rectangle</li> + <li> Move your mouse over the purple rectangle. Nothig should happen</li> + <li> Move your mouse over the black rectangle. pointermove should be logged in the black rectangle</li> + <li> Release left mouse button. "lostpointercapture" should be logged in the black rectangle</li> + </ol> + </h4> + Test passes if the proper behaviour of the events is observed. + --> + <div id="target0"></div> + <br> + <div id="target1"></div> + <br> + <input type="button" id="btnCapture" value="Set Capture"> + <script type='text/javascript'> + var isPointerCapture = false; + var pointermoveNoCaptureGot0 = false; + var pointermoveCaptureGot0 = false; + var pointermoveNoCaptureGot1 = false; + var ownEventForTheCapturedTargetGot = false; + var count=0; + + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var target0 = document.getElementById('target0'); + var target1 = document.getElementById('target1'); + var captureButton = document.getElementById('btnCapture'); + + var test_gotpointercapture = async_test("gotpointercapture event received"); + var test_lostpointercapture = async_test("lostpointercapture event received"); + + window.onload = function() { + on_event(captureButton, 'pointerdown', function(e) { + if(isPointerCapture == false) { + isPointerCapture = true; + sPointerCapture(e); + } + }); + + on_event(target0, 'gotpointercapture', function(e) { + test_gotpointercapture.done(); + log("gotpointercapture", target0); + }); + + on_event(target0, 'lostpointercapture', function(e) { + test_lostpointercapture.done(); + isPointerCapture = false; + log("lostpointercapture", target0); + }); + + run(); + } + + function run() { + var test_pointermove0 = async_test("pointerover event for black rectangle received") + var test_pointermove1 = async_test("pointerover event for purple rectangle received") + + on_event(target0, "pointermove", function (event) { + detected_pointertypes[ event.pointerType ] = true; + if(!pointermoveNoCaptureGot0) { + test_pointermove0.done(); + log("pointermove", document.getElementById('target0')); + pointermoveNoCaptureGot0 = true; + } + if(isPointerCapture) { + if(!pointermoveCaptureGot0) { + test(function() { + assert_true(event.relatedTarget==null, "relatedTarget is null when the capture is set") + }, "relatedTarget is null when the capture is set. relatedTarget is " + event.relatedTarget); + test(function() { + assert_true((event.clientX < target0.getBoundingClientRect().left)|| + (event.clientX > target0.getBoundingClientRect().right)|| + (event.clientY < target0.getBoundingClientRect().top)|| + (event.clientY > target0.getBoundingClientRect().bottom), + "pointermove received for captured element while out of it") + }, "pointermove received for captured element while out of it"); + log("pointermove", document.getElementById('target0')); + pointermoveCaptureGot0 = true; + } + if((event.clientX > target0.getBoundingClientRect().left)&& + (event.clientX < target0.getBoundingClientRect().right)&& + (event.clientY > target0.getBoundingClientRect().top)&& + (event.clientY < target0.getBoundingClientRect().bottom)&& + !ownEventForTheCapturedTargetGot) { + test(function() { + assert_true(true, "pointermove received for captured element while inside of it"); + }, "pointermove received for captured element while inside of it"); + log("pointermove", document.getElementById('target0')); + ownEventForTheCapturedTargetGot = true; + } + } + }); + + on_event(target1, "pointermove", function (event) { + if(isPointerCapture == true) { + test(function() { + assert_unreached("pointermove shouldn't trigger for this target when capture is enabled"); + }, "pointermove shouldn't trigger for the purple rectangle while the black rectangle has capture"); + } + if(!pointermoveNoCaptureGot1) { + test_pointermove1.done(); + log("pointermove", document.getElementById('target1')); + pointermoveNoCaptureGot1 = true; + } + }); + } + </script> + <h1>Pointer Events Capture Test</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_capture_suppressing_mouse-manual.html b/dom/events/test/pointerevents/pointerevent_capture_suppressing_mouse-manual.html new file mode 100644 index 000000000..6b891b846 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_capture_suppressing_mouse-manual.html @@ -0,0 +1,186 @@ +<!doctype html> +<html> + <head> + <title>Set/Release capture</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body> + <!-- + <h1>Pointer Events capture test</h1> + <h4> + Test Description: This test checks if setCapture/releaseCapture functions works properly. Complete the following actions: + <ol> + <li> Put your mouse over the black rectangle. pointerover and pointerenter should be logged inside of it.</li> + <li> Move your mouse out of the black rectangle. pointerout and pointerleave should be logged inside of it</li> + <li> Put your mouse over the purple rectangle. pointerover and pointerenter should be logged inside of it.</li> + <li> Move your mouse out of the purple rectangle. pointerout and pointerleave should be logged inside of it</li> + <li> Press and hold left mouse button over "Set Capture" button. "gotpointercapture" should be logged in the black rectangle</li> + <li> Put your mouse over the purple rectangle and then move it out. Nothing should happen</li> + <li> Put your mouse over the black rectangle. pointerover and pointerenter should be logged inside of it.</li> + <li> Move your mouse out of the black rectangle. pointerout and pointerleave should be logged inside of it</li> + <li> Release left mouse button. "lostpointercapture" should be logged in the black rectangle</li> + </ol> + </h4> + Test passes if the proper behaviour of the events is observed. + --> + <div id="target0"></div> + <br> + <div id="target1"></div> + <br> + <input type="button" id="btnCapture" value="Set Capture"> + <script type='text/javascript'> + var isPointerCapture = false; + var isRelatedTargetValueTested = false; + var isTargetAuthenticityTested = false; + var count = 0; + + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var target0 = document.getElementById('target0'); + var target1 = document.getElementById('target1'); + var captureButton = document.getElementById('btnCapture'); + + var test_gotpointercapture = async_test("gotpointercapture event received"); + var test_lostpointercapture = async_test("lostpointercapture event received"); + + var test_pointerover_no_capture = async_test("pointerover event without capture received"); + var test_pointerover_capture = async_test("pointerover event with capture received"); + + var test_pointerout_no_capture = async_test("pointerout event without capture received"); + var test_pointerout_capture = async_test("pointerout event with capture received"); + + var test_pointerenter_no_capture = async_test("pointerenter event without capture received"); + var test_pointerenter_capture = async_test("pointerenter event with capture received"); + + var test_pointerleave_no_capture = async_test("pointerleave event without capture received"); + var test_pointerleave_capture = async_test("pointerleave event with capture received"); + + window.onload = function() { + on_event(captureButton, 'pointerdown', function(e) { + if(isPointerCapture == false) { + sPointerCapture(e); + isPointerCapture = true; + } + }); + + on_event(target0, 'gotpointercapture', function(e) { + test_gotpointercapture.done(); + log("gotpointercapture", target0); + }); + + on_event(target0, 'lostpointercapture', function(e) { + isPointerCapture = false; + test_lostpointercapture.done(); + log("lostpointercapture", target0); + }); + + run(); + } + + function run() { + on_event(target0, "pointerover", function (event) { + detected_pointertypes[ event.pointerType ] = true; + log("pointerover", target0); + if(isPointerCapture) { + test_pointerover_capture.done(); + if (!isRelatedTargetValueTested) { + test(function() { + assert_true(event.relatedTarget==null, "relatedTarget is null when the capture is set") + }, "relatedTarget is null when the capture is set. relatedTarget is " + event.relatedTarget); + isRelatedTargetValueTested = true; + } + var hitTest = document.elementFromPoint(event.clientX, event.clientY); + if(event.target !== hitTest && !isTargetAuthenticityTested) { + test(function () { + assert_unreached("pointerover for this target shouldn't trigger events on capture target"); + }, "pointerover should only trigger over the black rectangle"); + isTargetAuthenticityTested = true; + } + } + else { + test_pointerover_no_capture.done(); + } + }); + + on_event(target0, "pointerout", function (event) { + log("pointerout", target0); + if(isPointerCapture) { + test_pointerout_capture.done(); + } + else { + test_pointerout_no_capture.done(); + } + }); + + on_event(target0, "pointerenter", function (event) { + log("pointerenter", target0); + if(isPointerCapture) { + test_pointerenter_capture.done(); + } + else { + test_pointerenter_no_capture.done(); + } + }); + + on_event(target0, "pointerleave", function (event) { + log("pointerleave", target0); + if(isPointerCapture) { + test_pointerleave_capture.done(); + } + else { + test_pointerleave_no_capture.done(); + } + }); + + // fail if capture is set but event is received for the non-captured target + on_event(target1, "pointerover", function (event) { + log("pointerover", target1); + if(isPointerCapture == true) { + test(function() { + assert_unreached("pointerover shouldn't trigger for this target when capture is enabled"); + }, "pointerover shouldn't trigger for the purple rectangle while the black rectangle has capture"); + } + }); + + on_event(target1, "pointerout", function (event) { + log("pointerout", target1); + if(isPointerCapture == true) { + test(function() { + assert_unreached("pointerout shouldn't trigger for this target when capture is enabled"); + }, "pointerout shouldn't trigger for the purple rectangle while the black rectangle has capture"); + } + }); + + on_event(target1, "pointerenter", function (event) { + log("pointerenter", target1); + if(isPointerCapture == true) { + test(function() { + assert_unreached("pointerenter shouldn't trigger for this target when capture is enabled"); + }, "pointerenter shouldn't trigger for the purple rectangle while the black rectangle has capture"); + } + }); + + on_event(target1, "pointerleave", function (event) { + log("pointerleave", target1); + if(isPointerCapture == true) { + test(function() { + assert_unreached("pointerleave shouldn't trigger for this target when capture is enabled"); + }, "pointerleave shouldn't trigger for the purple rectangle while the black rectangle has capture"); + } + }); + } + </script> + <h1>Pointer Events Capture Test</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_change-touch-action-onpointerdown_touch-manual.html b/dom/events/test/pointerevents/pointerevent_change-touch-action-onpointerdown_touch-manual.html new file mode 100644 index 000000000..b5f522f8b --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_change-touch-action-onpointerdown_touch-manual.html @@ -0,0 +1,138 @@ +<!doctype html> +<html> + <head> + <title>Change touch-action on pointerdown</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + <style> + #target0 { + background: black; + width: 700px; + height: 430px; + color: white; + overflow-y: auto; + overflow-x: auto; + white-space: nowrap; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <!-- + <h4>Test Description: Press and hold your touch. Try to scroll text in any direction. + Then release your touch and try to scroll again. Expected: no panning. + </h4> + <p>Note: this test is for touch-devices only</p> + --> + <div id="target0" style="touch-action: auto;"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <script type='text/javascript'> + var detected_pointertypes = {}; + + var styleIsChanged = false; + var scrollIsReceived = false; + var firstTouchCompleted = false; + var countToPass = 50; + var xScr0, yScr0, xScr1, yScr1; + + setup({ explicit_done: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, 'scroll', function(event) { + if(!scrollIsReceived && firstTouchCompleted) { + test(function() { + failOnScroll(); + }, "scroll was received while shouldn't"); + scrollIsReceived = true; + } + done(); + }); + + on_event(target0, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + if(!styleIsChanged) { + var before = document.getElementById('target0').style.touchAction; + + document.getElementById('target0').style.touchAction = 'none'; + + var after = document.getElementById('target0').style.touchAction; + + test(function() { + assert_true(before != after, "touch-action was changed"); + }, "touch-action was changed"); + + styleIsChanged = true; + } + }); + + on_event(target0, 'pointerup', function(event) { + firstTouchCompleted = true; + }); + } + </script> + <h1>touch-action: auto to none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_constructor.html b/dom/events/test/pointerevents/pointerevent_constructor.html new file mode 100644 index 000000000..9ef04cccb --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_constructor.html @@ -0,0 +1,101 @@ +<!doctype html> +<html> + <head> + <title>PointerEvent: Constructor test</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>PointerEvent: Dispatch custom event</h1> + <h4>Test Description: This test checks if PointerEvent constructor works properly using synthetic pointerover and pointerout events. For valid results, this test must be run without generating real (trusted) pointerover or pointerout events on the black rectangle below.</h4> + <div id="target0"></div> + <script> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + async_test(function() { + var target0 = document.getElementById("target0"); + // set values for non-default constructor + var testBubbles = true; + var testCancelable = true; + var testPointerId = 42; + var testPointerType = 'pen'; + var testClientX = 300; + var testClientY = 500; + var testWidth = 3; + var testHeight = 5; + var testTiltX = -45; + var testTiltY = 30; + var testPressure = 0.4; + var testIsPrimary = true; + + on_event(target0, "pointerover", this.step_func(function(event) { + detected_pointertypes[ event.pointerType ] = true; + generate_tests(assert_equals, [ + ["custom bubbles", event.bubbles, testBubbles], + ["custom cancelable", event.cancelable, testCancelable], + ["custom pointerId", event.pointerId, testPointerId], + ["custom pointerType", event.pointerType, testPointerType], + ["custom width", event.width, testWidth], + ["custom height", event.height, testHeight], + ["custom clientX", event.clientX, testClientX], + ["custom clientY", event.clientY, testClientY], + ["custom tiltX", event.tiltX, testTiltX], + ["custom tiltY", event.tiltY, testTiltY], + ["custom isPrimary", event.isPrimary, testIsPrimary] + ]); + test(function() { + assert_approx_equals(event.pressure, testPressure, 0.00000001, "custom pressure: "); + }, "custom pressure: "); + })); + + on_event(target0, "pointerout", this.step_func(function(event) { + generate_tests(assert_equals, [ + ["default pointerId", event.pointerId, 0], + ["default pointerType", event.pointerType, ""], + ["default width", event.width, 1], + ["default height", event.height, 1], + ["default tiltX", event.tiltX, 0], + ["default tiltY", event.tiltY, 0], + ["default pressure", event.pressure, 0], + ["default isPrimary", event.isPrimary, false] + ]); + })); + + on_event(window, "load", this.step_func_done(function() { + assert_not_equals(window.PointerEvent, undefined); + + var pointerEventCustom = new PointerEvent("pointerover", + {bubbles: testBubbles, + cancelable: testCancelable, + pointerId: testPointerId, + pointerType: testPointerType, + width: testWidth, + height: testHeight, + clientX: testClientX, + clientY: testClientY, + tiltX: testTiltX, + tiltY: testTiltY, + pressure: testPressure, + isPrimary: testIsPrimary + }); + // A PointerEvent created with a PointerEvent constructor must have all its attributes set to the corresponding values provided to the constructor. + // For attributes where values are not provided to the constructor, the corresponding default values must be used. + // TA: 12.1 + target0.dispatchEvent(pointerEventCustom); + var pointerEventDefault = new PointerEvent("pointerout"); + target0.dispatchEvent(pointerEventDefault); + }, "PointerEvent constructor")); + }) + </script> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_element_haspointercapture-manual.html b/dom/events/test/pointerevents/pointerevent_element_haspointercapture-manual.html new file mode 100644 index 000000000..1826467fe --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_element_haspointercapture-manual.html @@ -0,0 +1,123 @@ +<!doctype html> +<html> + <head> + <title>Element.hasPointerCapture test</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + var test_pointerEvent = async_test("hasPointerCapture"); + var listening_events = [ + "pointerover", + "pointerenter", + "pointerout", + "pointerleave", + "pointermove", + "gotpointercapture" + ]; + var set_capture_to_target0 = false; + + function run() { + var target0 = document.getElementById("target0"); + var target1 = document.getElementById("target1"); + + on_event(target0, "pointerdown", function (e) { + detected_pointertypes[e.pointerType] = true; + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), false, + "before target0.setPointerCapture, target0.hasPointerCapture should be false"); + }); + target1.setPointerCapture(e.pointerId); + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), false, + "after target1.setPointerCapture, target0.hasPointerCapture should be false"); + assert_equals(target1.hasPointerCapture(e.pointerId), true, + "after target1.setPointerCapture, target1.hasPointerCapture should be true"); + }); + target0.setPointerCapture(e.pointerId); + set_capture_to_target0 = true; + // hasPointerCapture will return true immediately after a call to setPointerCapture + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), true, + "after target0.setPointerCapture, target0.hasPointerCapture should be true"); + }); + // hasPointerCapture will return false immediately after a call to releasePointerCapture + target0.releasePointerCapture(e.pointerId); + set_capture_to_target0 = false; + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), false, + "after target0.releasePointerCapture, target0.hasPointerCapture should be false"); + assert_equals(target1.hasPointerCapture(e.pointerId), false, + "after target0.releasePointerCapture, target1.hasPointerCapture should be false"); + }); + target0.setPointerCapture(e.pointerId); + set_capture_to_target0 = true; + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), true, + "after target0.setPointerCapture, target0.hasPointerCapture should be true"); + }); + }); + + for (var i = 0; i < listening_events.length; i++) { + on_event(target0, listening_events[i], function (e) { + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), set_capture_to_target0, + "Received " + e.type + " target0.hasPointerCapture should be " + set_capture_to_target0); + }); + }); + } + + on_event(target0, "pointerup", function (e) { + // Immediately after firing the pointerup or pointercancel events, a user agent must run the steps + // as if the releasePointerCapture() method has been called + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), true, + "pointerup target0.hasPointerCapture should be true"); + }); + set_capture_to_target0 = false; + }); + + on_event(target0, "lostpointercapture", function (e) { + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), false, + "pointerup target0.hasPointerCapture should be false"); + }); + }); + + on_event(target1, "pointerup", function (e) { + test_pointerEvent.step(function () { + assert_equals(target1.hasPointerCapture(e.pointerId), false, + "pointerup target1.hasPointerCapture should be false"); + }); + test_pointerEvent.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Element.hasPointerCapture test</h1> + <!-- + <h4> + Test Description: This test checks if Element.hasPointerCapture returns value correctly + <ol> + <li> Press black rectangle and do not release + <li> Move your pointer to purple rectangle + <li> Release the pointer + <li> Click purple rectangle + </ol> + </h4> + <p> + --> + <div id="target0" touch-action:none></div> + <div id="target1" touch-action:none></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_element_haspointercapture_release_pending_capture-manual.html b/dom/events/test/pointerevents/pointerevent_element_haspointercapture_release_pending_capture-manual.html new file mode 100644 index 000000000..a0f25c131 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_element_haspointercapture_release_pending_capture-manual.html @@ -0,0 +1,76 @@ +<!doctype html> +<html> + <head> + <title>Element.hasPointerCapture test after the pending pointer capture element releases pointer capture</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + var test_pointerEvent = async_test("hasPointerCapture test after the pending pointer capture element releases pointer capture"); + + function run() { + var target0 = document.getElementById("target0"); + var target1 = document.getElementById("target1"); + + on_event(target0, "pointerdown", function (e) { + detected_pointertypes[e.pointerType] = true; + target0.setPointerCapture(e.pointerId); + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), true, "After target0.setPointerCapture, target0.hasPointerCapture should return true"); + }); + }); + + on_event(target0, "gotpointercapture", function (e) { + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), true, "After target0 received gotpointercapture, target0.hasPointerCapture should return true"); + }); + target1.setPointerCapture(e.pointerId); + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), false, "After target1.setPointerCapture, target0.hasPointerCapture should return false"); + assert_equals(target1.hasPointerCapture(e.pointerId), true, "After target1.setPointerCapture, target1.hasPointerCapture should return true"); + }); + target1.releasePointerCapture(e.pointerId); + test_pointerEvent.step(function () { + assert_equals(target0.hasPointerCapture(e.pointerId), false, "After target1.releasePointerCapture, target0.hasPointerCapture should be false"); + assert_equals(target1.hasPointerCapture(e.pointerId), false, "After target1.releasePointerCapture, target1.hasPointerCapture should be false"); + }); + }); + + on_event(target1, "gotpointercapture", function (e) { + test_pointerEvent.step(function () { + assert_true(false, "target1 should never receive gotpointercapture in this test"); + }); + }); + + on_event(target0, "lostpointercapture", function (e) { + test_pointerEvent.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Element.hasPointerCapture test after the pending pointer capture element releases pointer capture</h1> + <!-- + <h4> + Test Description: This test checks if Element.hasPointerCapture returns value correctly after the pending pointer capture element releases pointer capture + <ol> + <li> Press black rectangle and do not release + <li> Move your pointer to purple rectangle + <li> Release the pointer + </ol> + </h4> + --> + <p> + <div id="target0" touch-action:none></div> + <div id="target1" touch-action:none></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_gotpointercapture_before_first_pointerevent-manual.html b/dom/events/test/pointerevents/pointerevent_gotpointercapture_before_first_pointerevent-manual.html new file mode 100644 index 000000000..0589ff2b3 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_gotpointercapture_before_first_pointerevent-manual.html @@ -0,0 +1,100 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: gotpiontercapture is fired first and asynchronously.</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <meta name="assert" content="After setting capture, the gotpointercapture dispatched to the capturing element before any other event is fired." /> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("gotpointercapture event"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var target0; + var listener; + var pointerdown_event; + var detected_pointerEvents = new Array(); + var eventRcvd = false; + var isWaiting = false; + + + function run() { + target0 = document.getElementById("target0"); + target0.style["touchAction"] = "none"; + listener = document.getElementById("listener"); + + // listen to all events + for (var i = 0; i < All_Pointer_Events.length; i++) { + on_event(listener, All_Pointer_Events[i], function (event) { + if (event.type == "gotpointercapture") { + check_PointerEvent(event); + + // TA: 10.2 + assert_true(isWaiting, "gotpointercapture must be fired asynchronously"); + isWaiting = false; + + // if any events have been received with same pointerId before gotpointercapture, then fail + var eventsRcvd_str = ""; + if (eventRcvd) { + eventsRcvd_str = "Events received before gotpointercapture: "; + for (var i = 0; i < detected_pointerEvents.length; i++) { + eventsRcvd_str += detected_pointerEvents[i] + ", "; + } + } + test_pointerEvent.step(function () { + assert_false(eventRcvd, "no other events should be received before gotpointercapture." + eventsRcvd_str); + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointerID is same for pointerdown and gotpointercapture"); + }); + } + else { + if (pointerdown_event.pointerId === event.pointerId) { + assert_false(isWaiting, event.type + " must be fired after gotpointercapture"); + detected_pointerEvents.push(event.type); + eventRcvd = true; + test_pointerEvent.done(); // complete test + } + } + }); + } + + // set pointer capture + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[event.pointerType] = true; + pointerdown_event = event; + listener.setPointerCapture(event.pointerId); + isWaiting = true; + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch gotpointercapture event</h1> + <!-- + <h4>Test Description: + After pointer capture is set for a pointer, and prior to dispatching the first event for the pointer, the gotpointercapture + event must be dispatched to the element that is receiving the pointer capture. The gotpointercapture event must be dispatched asynchronously. + </h4> + <br /> + --> + <div id="target0"> + Use the mouse, touch or pen to tap/click this box. + </div> + <div id="listener">Do not hover over or touch this element. </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_lostpointercapture_for_disconnected_node-manual.html b/dom/events/test/pointerevents/pointerevent_lostpointercapture_for_disconnected_node-manual.html new file mode 100644 index 000000000..d103804dc --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_lostpointercapture_for_disconnected_node-manual.html @@ -0,0 +1,81 @@ +<!doctype html> +<html> + <head> + <title>Lostpointercapture fires on document when target is removed</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body> + <!-- + <h1>Pointer Events - lostpointercapture when capturing element is removed</h1> + <h4> + Test Description: + This test checks if lostpointercapture is fired at the document when the capturing node is removed from the document. + Complete the following actions: + <ol> + <li>Press and hold left mouse button over "Set Capture" button. "gotpointercapture" should be logged inside of the black rectangle. + <li>"lostpointercapture" should be logged inside of the black rectangle after a short delay. + </ol> + </h4> + --> + <div id="target0"></div> + <div id="target1" style="background:black; color:white"></div> + <br> + <input type="button" id="btnCapture" value="Set Capture"> + <script type='text/javascript'> + var isDisconnected = false; + var count = 0; + + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var target0 = document.getElementById('target0'); + var target1 = document.getElementById('target1'); + var captureButton = document.getElementById('btnCapture'); + + var test_lostpointercapture = async_test("lostpointercapture event received"); + + window.onload = function() { + on_event(captureButton, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + sPointerCapture(event); + }); + + on_event(target0, 'gotpointercapture', function(e) { + log("gotpointercapture", target1); + setTimeout(function() { + isDisconnected = true; + target0.parentNode.removeChild(target0); + }, 250); + }); + + on_event(target0, 'lostpointercapture', function(e) { + log("lostpointercapture on element", target1); + test(function() { + // TA: 11.3 + assert_unreached("lostpointercapture must be fired on the document, not the capturing element"); + }, "lostpointercapture must not be dispatched on the disconnected node"); + }); + + on_event(document, 'lostpointercapture', function(e) { + log("lostpointercapture on document", target1); + test(function() { + // TA: 11.3 + assert_true(isDisconnected, "lostpointercapture must be fired on the document"); + + }, "lostpointercapture is dispatched on the document"); + test_lostpointercapture.done(); + }); + } + </script> + <h1>Pointer Events Capture Test</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_lostpointercapture_is_first-manual.html b/dom/events/test/pointerevents/pointerevent_lostpointercapture_is_first-manual.html new file mode 100644 index 000000000..16a000cbe --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_lostpointercapture_is_first-manual.html @@ -0,0 +1,118 @@ +<!doctype html> +<html> + <head> + <title>Lostpointercapture triggers first and asynchronously</title> + <meta name="assert" content="TA5.2.10: A user agent must fire a pointer event named lostpointercapture after pointer capture is released for a pointer. This event must be fired prior to any subsequent events for the pointer after capture was released. This event is fired at the element from which pointer capture was removed;"> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>Pointer Events capture test - lostpointercapture order</h1> + <!-- + <h4> + Test Description: + This test checks if lostpointercapture is handled asynchronously and prior to all subsequent events. + Complete the following actions: + <ol> + <li>Press and hold left mouse button over "Set Capture" button. "gotpointercapture" should be logged inside of the black rectangle + <li>"lostpointercapture" should be logged inside of the black rectangle after pointerup + </ol> + </h4> + Test passes if lostpointercapture is dispatched after releasing the mouse button and before any additional pointer events. + --> + <div id="target0" style="background:black; color:white"></div> + <br> + <input type="button" id="btnCapture" value="Set Capture"> + <script type='text/javascript'> + var detected_pointertypes = {}; + var detected_pointerEvents = new Array(); + var pointerdown_event = null; + + var test_pointerEvent = async_test("lostpointercapture is dispatched prior to subsequent events"); // set up test harness + + var isPointerCapture = false; + var count=0; + + var testStarted = false; + var eventRcvd = false; + var isAsync = false; + + add_completion_callback(showPointerTypes); + + var target0 = document.getElementById('target0'); + var captureButton = document.getElementById('btnCapture'); + + function run() { + on_event(captureButton, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + pointerdown_event = event; + if(isPointerCapture == false) { + isPointerCapture = true; + captureButton.value = 'Release Capture'; + sPointerCapture(event); + } + }); + + // TA5.1.3.1: Process Pending Pointer Capture + // Whenever a user agent is to fire a Pointer Event that is not gotpointercapture or lostpointercapture, + // it must first run the steps of processing pending pointer capture + // + // TA5.2.12: The lostpointercapture event + // After pointer capture is released for a pointer, and prior to any subsequent events for the pointer, + // the lostpointercapture event must be dispatched to the element from which pointer capture was removed. + // listen to all events + for (var i = 0; i < All_Pointer_Events.length; i++) { + on_event(target0, All_Pointer_Events[i], function (event) { + // if the event was gotpointercapture, just log it and return + if (event.type == "gotpointercapture") { + testStarted = true; + rPointerCapture(event); + isAsync = true; + log("gotpointercapture", target0); + return; + } + else if (event.type == "lostpointercapture") { + log("lostpointercapture", target0); + captureButton.value = 'Set Capture'; + isPointerCapture = false; + + // TA: 11.2 + test_pointerEvent.step(function () { + assert_true(isAsync, "lostpointercapture must be fired asynchronously"); + }); + + // if any events except pointerup have been received with same pointerId before lostpointercapture, then fail + var eventsRcvd_str = ""; + if (eventRcvd) { + eventsRcvd_str = "Events received before lostpointercapture: "; + for (var i = 0; i < detected_pointerEvents.length; i++) { + eventsRcvd_str += detected_pointerEvents[i] + ", "; + } + } + test_pointerEvent.step(function () { + assert_false(eventRcvd, "no other events should be received before lostpointercapture." + eventsRcvd_str); + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointerID is same for pointerdown and lostpointercapture"); + }); + test_pointerEvent.done(); // complete test + } + else { + if (testStarted && pointerdown_event != null && pointerdown_event.pointerId === event.pointerId && event.type != "pointerup") { + detected_pointerEvents.push(event.type); + eventRcvd = true; + } + } + }); + } + } + </script> + <h1>Pointer Events Capture Test</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_multiple_primary_pointers_boundary_events-manual.html b/dom/events/test/pointerevents/pointerevent_multiple_primary_pointers_boundary_events-manual.html new file mode 100644 index 000000000..296d9d49f --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_multiple_primary_pointers_boundary_events-manual.html @@ -0,0 +1,148 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Boundary compatibility events for multiple primary pointers</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Google" href="http://www.google.com "/> + <meta name="assert" content="When more than one primary pointers are active, each will have an independent sequence of pointer boundary events but the compatibilty mouse boundary events have their own sequence."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var test_pointerEvent = async_test("Multi-pointer boundary compat events"); + add_completion_callback(end_of_test); + + var detected_pointertypes = {}; + var event_log = []; + + // These two ids help us detect two different pointing devices. + var first_entry_pointer_id = -1; + var second_entry_pointer_id = -1; + + // Current node for each pointer id + var current_node_for_id = {}; + + function end_of_test() { + showLoggedEvents(); + showPointerTypes(); + } + + function end_of_interaction() { + test(function () { + assert_equals(event_log.join(", "), + "mouseover@target0, mouseenter@target0, mouseout@target0, mouseleave@target0, " + + "mouseover@target1, mouseenter@target1, mouseout@target1, mouseleave@target1, " + + "mouseover@target0, mouseenter@target0, mouseout@target0, mouseleave@target0" + ); + }, "Event log"); + + test_pointerEvent.done(); // complete test + } + + function log_event(label) { + event_log.push(label); + } + + function run() { + on_event(document.getElementById("done"), "click", end_of_interaction); + + var target_list = ["target0", "target1"]; + var pointer_event_list = ["pointerenter", "pointerleave", "pointerover", "pointerout", "pointerdown"]; + var mouse_event_list = ["mouseenter", "mouseleave", "mouseover", "mouseout"]; + + target_list.forEach(function(targetId) { + var target = document.getElementById(targetId); + + pointer_event_list.forEach(function(eventName) { + on_event(target, eventName, function (event) { + var label = event.type + "@" + targetId; + + detected_pointertypes[event.pointerType] = true; + + if (!event.isPrimary) { + test(function () { + assert_unreached("Non-primary pointer " + label); + }, "Non-primary pointer " + label); + } + + if (event.type === "pointerenter") { + var pointer_id = event.pointerId; + if (current_node_for_id[pointer_id] !== undefined) { + test(function () { + assert_unreached("Double entry " + label); + }, "Double entry " + label); + } + current_node_for_id[pointer_id] = event.target; + + // Test that two different pointing devices are used + if (first_entry_pointer_id === -1) { + first_entry_pointer_id = pointer_id; + } else if (second_entry_pointer_id === -1) { + second_entry_pointer_id = pointer_id; + test(function () { + assert_true(first_entry_pointer_id !== second_entry_pointer_id); + }, "Different pointing devices"); + } + } else if (event.type === "pointerleave") { + var pointer_id = event.pointerId; + if (current_node_for_id[pointer_id] !== event.target) { + test(function () { + assert_unreached("Double exit " + label); + }, "Double exit " + label); + } + current_node_for_id[pointer_id] = undefined; + } + }); + }); + + mouse_event_list.forEach(function(eventName) { + on_event(target, eventName, function (event) { + log_event(event.type + "@" + targetId); + }); + }); + }); + } + </script> + <style> + #target0, #target1 { + margin: 20px; + } + + #done { + margin: 20px; + border: 2px solid black; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Event: Boundary compatibility events for multiple primary pointers</h1> + <!-- + <h4> + When more than one primary pointers are active, each will have an independent sequence of pointer boundary events but the compatibilty mouse boundary events have their own sequence. + </h4> + Instruction: + <ol> + <li>Move the mouse directly into Target0 (without going through Target1), and then leave the mouse there unmoved.</li> + <li>Tap directly on Target1 with a finger or a stylus, and then lift the finger/stylus off the screen/digitizer without crossing Target1 boundary.</li> + <li>Move the mouse into Target0 (if not there already) and move inside it.</li> + <li>Click Done (without passing over Target1).</li> + </ol> + --> + <div id="done"> + Done + </div> + <div id="target0"> + Target0 + </div> + <div id="target1"> + Target1 + </div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>The following events were logged: <span id="event-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointerId_scope-manual.html b/dom/events/test/pointerevents/pointerevent_pointerId_scope-manual.html new file mode 100644 index 000000000..98bbb879d --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerId_scope-manual.html @@ -0,0 +1,85 @@ +<!doctype html> +<html> + <!-- +Test cases for Pointer Events v1 spec +This document references Test Assertions (abbrev TA below) written by Cathy Chan +http://www.w3.org/wiki/PointerEvents/TestAssertions +--> + <head> + <title>Pointer Events pointerdown tests</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerId of an active pointer is the same across iframes"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + var detected_pointertypes = {}; + + function run() { + var target0 = document.getElementById("target0"); + var pointerover_pointerId = null; + var pointerover_pointerType = null; + + var eventList = ['pointerenter', 'pointerover', 'pointermove', 'pointerout', 'pointerleave']; + var receivedEvents = {}; + var receivedEventsInnerFrame = {}; + + + function checkPointerId(event, inner) { + detected_pointertypes[event.pointerType] = true; + var eventName = (inner ? "inner frame " : "" ) + event.type; + test_pointerEvent.step(function() { + assert_equals(event.pointerId, pointerover_pointerId, "PointerId of " + eventName + " is not correct"); + assert_equals(event.pointerType, pointerover_pointerType, "PointerType of " + eventName + " is not correct"); + }, eventName + ".pointerId were the same as first pointerover"); + } + + on_event(window, "message", function(event) { + var pe_event = JSON.parse(event.data); + receivedEventsInnerFrame[pe_event.type] = 1; + checkPointerId(pe_event, true); + if (Object.keys(receivedEvents).length == eventList.length && Object.keys(receivedEventsInnerFrame).length == eventList.length) + test_pointerEvent.done(); + }); + + eventList.forEach(function(eventName) { + on_event(target0, eventName, function (event) { + if (pointerover_pointerId === null && event.type == 'pointerover') { + pointerover_pointerId = event.pointerId; + pointerover_pointerType = event.pointerType; + } else { + checkPointerId(event, false); + } + receivedEvents[event.type] = 1; + }); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Events pointerdown tests</h1> + Complete the following actions: + <!-- + <ol> + <li>Start with your pointing device outside of black box, then move it into black box. If using touch just press in black box and don't release. + <li>Move your pointing device into purple box (without leaving the digitizer range if you are using hover supported pen or without releasing touch if using touch). Then move it out of the purple box. + </ol> + --> + <div id="target0" class="touchActionNone"> + </div> + <iframe src="resources/pointerevent_pointerId_scope-iframe.html" id="innerframe"></iframe> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointercancel_touch-manual.html b/dom/events/test/pointerevents/pointerevent_pointercancel_touch-manual.html new file mode 100644 index 000000000..00f4495dc --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointercancel_touch-manual.html @@ -0,0 +1,80 @@ +<!doctype html> +<html> + <head> + <title>PointerCancel - touch</title> + <meta name="viewport" content="width=device-width"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body class="scrollable" onload="run()"> + <h1>pointercancel test</h1> + <!-- + <h3>Warning: this test works properly only for devices that have touchscreen</h3> + <h4> + Test Description: This test checks if pointercancel event triggers. + <p>Start touch over the black rectangle and then move your finger to scroll the page.</p> + </h4> + <p> + --> + <div id="target0" style="background: black"></div> + <script> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointercancel event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var pointerdown_event = null; + var pointercancel_event = null; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerdown", function (event) { + pointerdown_event = event; + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, "pointercancel", function (event) { + pointercancel_event = event; + test_pointerEvent.step(function () { + assert_not_equals(pointerdown_event, null, "pointerdown was received: "); + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointerId should be the same for pointerdown and pointercancel"); + assert_equals(event.pointerType, pointerdown_event.pointerType, "pointerType should be the same for pointerdown and pointercancel"); + assert_equals(event.isPrimary, pointerdown_event.isPrimary, "isPrimary should be the same for pointerdown and pointercancel"); + check_PointerEvent(event); + }); + }); + + on_event(target0, "pointerout", function (event) { + test_pointerEvent.step(function () { + assert_not_equals(pointercancel_event, null, "pointercancel was received before pointerout: "); + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointerId should be the same for pointerout and pointercancel"); + assert_equals(event.pointerType, pointerdown_event.pointerType, "pointerType should be the same for pointerout and pointercancel"); + assert_equals(event.isPrimary, pointerdown_event.isPrimary, "isPrimary should be the same for pointerout and pointercancel"); + }); + }); + + on_event(target0, "pointerleave", function (event) { + test_pointerEvent.step(function () { + assert_not_equals(pointercancel_event, null, "pointercancel was received before pointerleave: "); + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointerId should be the same for pointerleave and pointercancel"); + assert_equals(event.pointerType, pointerdown_event.pointerType, "pointerType should be the same for pointerleave and pointercancel"); + assert_equals(event.isPrimary, pointerdown_event.isPrimary, "isPrimary should be the same for pointerleave and pointercancel"); + }); + test_pointerEvent.done(); + }); + } + </script> + <h1>Pointer Events pointercancel Tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointerdown-manual.html b/dom/events/test/pointerevents/pointerevent_pointerdown-manual.html new file mode 100644 index 000000000..eb80e68a3 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerdown-manual.html @@ -0,0 +1,60 @@ +<!doctype html> +<html> + <!-- +Test cases for Pointer Events v1 spec +This document references Test Assertions (abbrev TA below) written by Cathy Chan +http://www.w3.org/wiki/PointerEvents/TestAssertions +--> + <head> + <title>Pointer Events pointerdown tests</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerdown event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + + function run() { + var target0 = document.getElementById("target0"); + var pointerover_event; + + on_event(target0, "pointerover", function (event) { + detected_pointertypes[event.pointerType] = true; + pointerover_event = event; + check_PointerEvent(event); + }); + + on_event(target0, "pointerdown", function (event) { + check_PointerEvent(event); + + test_pointerEvent.step(function () { + assert_equals(event.pointerType, pointerover_event.pointerType, "pointerType is same for pointerover and pointerdown"); + assert_equals(event.isPrimary, pointerover_event.isPrimary, "isPrimary is same for pointerover and pointerdown"); + }); + + test_pointerEvent.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Events pointerdown tests</h1> + <div id="target0"> + Start with your pointing device outside of this box, then click here. + </div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerenter-manual.html b/dom/events/test/pointerevents/pointerevent_pointerenter-manual.html new file mode 100644 index 000000000..d03741769 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerenter-manual.html @@ -0,0 +1,53 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Dispatch pointerenter. </title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="When a pointing device is moved into the hit test boundaries of an element or one of its descendants, the pointerenter event must be dispatched."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerenter event"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerenter", function (event) { + detected_pointertypes[event.pointerType] = true; + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.type, "pointerenter", "pointer event received: " + event.type); + }); + test_pointerEvent.done(); // complete test + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointerenter</h1> + <h4> + Test Description: + When a pointing device is moved into the hit test boundaries of an element or one of its descendants, the pointerenter event must be dispatched. + </h4> + <div id="target0"> + Use the mouse or pen to move over this box. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerenter_does_not_bubble-manual.html b/dom/events/test/pointerevents/pointerevent_pointerenter_does_not_bubble-manual.html new file mode 100644 index 000000000..38289201e --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerenter_does_not_bubble-manual.html @@ -0,0 +1,91 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: The pointerenter event does not bubble </title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="The pointerenter event must not bubble up to parent elements."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerEnter event does not bubble"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var pointerenter_event = null; + + function run() { + var target0 = document.getElementById("target0"); + var parent0 = document.getElementById("parent0"); + + on_event(target0, "pointerenter", function (event) { + pointerenter_event = event; + + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.type, "pointerenter", "pointer event received: " + event.type); + assert_false(event.bubbles, "pointerenter event.bubbles should be false: " + event.bubbles); + }); + }); + on_event(target0, "pointerout", function (event) { + test_pointerEvent.step(function () { + assert_not_equals(pointerenter_event, null, "pointerout event was never received: "); + }); + test_pointerEvent.done(); // complete test + }); + + // parent + on_event(parent0, "pointerenter", function (event) { + detected_pointertypes[event.pointerType] = true; + test_pointerEvent.step(function () { + assert_equals(event.target.id, "parent0", "Recieved " + event.type + " in parent for " + event.target.id); + }); + }); + } + + </script> + <style> + #target0 { + background: purple; + border: 1px solid orange; + width:50px; + height:50px; + } + #parent0 { + background: black; + border: 1px solid orange; + width:100px; + height:100px; + } + </style> + </head> + <body onload="run()"> + <h1> Pointer Event: pointerenter does not bubble</h1> + <!-- + <h4> + Test Description: + The pointerenter event must not bubble up to parent elements. + </h4> + <div id="instructions"> + Use the mouse or pen to hover over then out of the purple box nested in the black box. Or with touch, tap on the purple box. + </div> + --> + <div id="parent0"> + <div id="target0"></div> + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerenter_nohover-manual.html b/dom/events/test/pointerevents/pointerevent_pointerenter_nohover-manual.html new file mode 100644 index 000000000..9b8d38ca5 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerenter_nohover-manual.html @@ -0,0 +1,77 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Dispatch pointerenter. (nohover)</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="When a pointing device that does not support hover is moved into the hit test boundaries of an element +or one of its descendants as a result of a pointerdown event, the pointerenter event must be dispatched. "/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerenter event"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var test_pointerEnter; + var f_pointerenter_rcvd = false; + var pointerenter_event; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerdown", function (event) { + if(event.pointerType == 'touch') { + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.type, "pointerdown", "pointer event received: " + event.type); + assert_true(f_pointerenter_rcvd, "pointerenter event should have been received before pointerdown"); + assert_equals(event.pointerType, pointerenter_event.pointerType, "pointerType is same for pointerenter and pointerdown"); + assert_equals(event.isPrimary, pointerenter_event.isPrimary, "isPrimary is same for pointerenter and pointerdown"); + }); + test_pointerEvent.done(); // complete test + } + }); + + on_event(target0, "pointerenter", function (event) { + detected_pointertypes[event.pointerType] = true; + if(event.pointerType == 'touch') { + pointerenter_event = event; + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.type, "pointerenter", "pointer event received: " + event.type); + }); + f_pointerenter_rcvd = true; + } + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointerenter (nohover)</h1> + <!-- + <h4> + Test Description: + When a pointing device that does not support hover is moved into the hit test boundaries of an element or one of its + descendants as a result of a pointerdown event, the pointerenter event must be dispatched. + </h4> + <br /> + --> + <div id="target0"> + Tap here. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_after_pointercancel_touch-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_after_pointercancel_touch-manual.html new file mode 100644 index 000000000..b04698d3d --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_after_pointercancel_touch-manual.html @@ -0,0 +1,67 @@ +<!doctype html> +<html> + <head> + <title>pointerleave after pointercancel</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body class="scrollable" onload="run()"> + <h2>pointerleave after pointercancel</h2> + <h4>Test Description: This test checks if pointerleave event triggers after pointercancel. Start touch on the black rectangle and move your touch to scroll in any direction. </h4> + <p>Note: this test is for touch devices only</p> + <div id="target0"></div> + <script> + var test_pointerleave = async_test("pointerleave event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var eventTested = false; + var pointercancel_event = null; + var detected_pointertypes = {}; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointercancel", function (event) { + detected_pointertypes[event.pointerType] = true; + pointercancel_event = event; + }); + + // After firing the pointercancel event the pointerleave event must be dispatched. + // TA: 4.3.1 + on_event(target0, "pointerleave", function (event) { + if(event.pointerType == 'touch') { + if(pointercancel_event != null) { + if(eventTested == false) { + test_pointerleave.step(function() { + assert_equals(event.pointerType, pointercancel_event.pointerType, "pointerType is same for pointercancel and pointerleave"); + assert_equals(event.isPrimary, pointercancel_event.isPrimary, "isPrimary is same for pointercancel and pointerleave"); + }); + eventTested = true; + test_pointerleave.done(); + } + } + else { + test_pointerleave.step(function() { + assert_unreached("pointerleave received before pointercancel"); + }, "pointerleave received before pointercancel"); + } + } + }); + } + + </script> + <h1>Pointer Events pointerleave tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_after_pointerup_nohover-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_after_pointerup_nohover-manual.html new file mode 100644 index 000000000..b0c74f23b --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_after_pointerup_nohover-manual.html @@ -0,0 +1,68 @@ +<!doctype html> +<html> + <head> + <title>pointerleave after pointerup</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h2>pointerleave after pointerup</h2> + <h4>Test Description: This test checks if pointerleave event triggers for devices that don't support hover. Tap the black rectangle. </h4> + <p>Note: this test is only for devices that do not support hover.</p> + <div id="target0"></div> + <script> + var test_pointerleave = async_test("pointerleave event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var eventTested = false; + var isPointerupReceived = false; + var pointerup_event = null; + var detected_pointertypes = {}; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerup", function (event) { + detected_pointertypes[event.pointerType] = true; + pointerup_event = event; + }); + + // For input devices that do not support hover, a pointerleave event must follow the pointerup event. + // TA: 3.6 + on_event(target0, "pointerleave", function (event) { + if(event.pointerType == 'touch') { + if(pointerup_event != null) { + if(eventTested == false) { + eventTested = true; + test_pointerleave.step(function() { + assert_equals(event.pointerType, pointerup_event.pointerType, "pointerType is same for pointerup and pointerleave"); + assert_equals(event.isPrimary, pointerup_event.isPrimary, "isPrimary is same for pointerup and pointerleave"); + }); + test_pointerleave.done(); + } + } + else { + test_pointerleave.step(function() { + assert_unreached("pointerleave received before pointerup"); + }, "pointerleave received before pointerup"); + } + } + }); + } + + </script> + <h1>Pointer Events pointerleave tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_descendant_over-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_descendant_over-manual.html new file mode 100644 index 000000000..61bf12224 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_descendant_over-manual.html @@ -0,0 +1,64 @@ +<!doctype html> +<html> + <head> + <title>pointerleave + descendant</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>pointerleave</h1> + <!-- + <h4> + Test Description: This test checks if pointerleave event works properly. + <ol> + <li>Put your mouse over the black rectangle + <li>Then move it into the purple rectangle + <li>Click on the purple rectangle to complete the test + </ol> + Note: when you entered the black rectangle once don't leave it before the end of the test to get proper results. + </h4> + <p> + --> + <div id="target0" style="background:black"> + <div id="target1" style="background:purple"></div> + </div> + <script> + var eventTested = false; + var pointerleaveReceived = false; + var detected_pointertypes = {}; + + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + // The pointerleave event must not be dispatched when the pointer enters a child element without leaving the hit test boundaries of the parent. (as distinct from pointerout) + // TA: 9.2 + on_event(target1, "pointerdown", function(event) { + detected_pointertypes[event.pointerType] = true; + + test(function() { + assert_true(!pointerleaveReceived, "pointerleave shouldn't be received on descendant's pointerover") + }, "pointerleave shouldn't be received on descendant's pointerover"); + }); + + on_event(target0, "pointerleave", function (event) { + if (eventTested == false) { + pointerleaveReceived = true; + eventTested = true; + } + }); + } + </script> + <h1>Pointer Events pointerleave tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_descendants-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_descendants-manual.html new file mode 100644 index 000000000..40542f2a2 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_descendants-manual.html @@ -0,0 +1,55 @@ +<!doctype html> +<html> + <head> + <title>Pointerleave + descendant</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>pointerleave</h1> + <!-- + <h4> + Test Description: This test checks if pointerleave event works properly. + <p>Put your mouse over the black rectangle and then move it out through purple rectangle boundaries.</p> + </h4> + <p> + --> + <div id="target0" style="background:black; height: 47px;"> + <div style="background:purple; height: 35px; width: 90%; position: absolute"></div> + </div> + <script> + var eventTested = false; + var detected_pointertypes = {}; + + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var test_pointerleave = async_test("pointerleave event received"); + + on_event(target0, "pointerover", function(event) { + detected_pointertypes[ event.pointerType ] = true; + }); + + // When a pointing device is moved off of the hit test boundaries of an element and all of its descendants, the pointerleave event must be dispatched. + // TA: 9.1 + on_event(target0, "pointerleave", function (event) { + if (eventTested == false) { + test_pointerleave.done(); + eventTested = true; + } + }); + } + </script> + <h1>Pointer Events pointerleave tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_does_not_bubble-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_does_not_bubble-manual.html new file mode 100644 index 000000000..662a714a9 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_does_not_bubble-manual.html @@ -0,0 +1,80 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: The pointerleave event does not bubble </title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="The pointerleave event must not bubble up to parent elements."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerLeave event does not bubble"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var parent0 = document.getElementById("parent0"); + + on_event(target0, "pointerleave", function (event) { + detected_pointertypes[event.pointerType] = true; + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.type, "pointerleave", "pointer event received: " + event.type); + assert_false(event.bubbles, "pointerleave event.bubbles should be false: " + event.bubbles); + }); + }); + + on_event(parent0, "pointerleave", function (event) { + test_pointerEvent.step(function () { + assert_equals(event.target.id, "parent0", "Recieved " + event.type + " in parent for " + event.target.id); + }); + test_pointerEvent.done(); // complete test + }); + } + </script> + <style> + #target0 { + background: purple; + border: 1px solid orange; + width:50px; + height:50px; + } + #parent0 { + background: black; + border: 1px solid orange; + width:100px; + height:100px; + } + </style> + </head> + <body onload="run()"> + <h1> Pointer Event: pointerleave does not bubble</h1> + <!-- + <h4> + Test Description: + The pointerleave event must not bubble up to parent elements. + </h4> + <div id="instructions"> + Use the mouse or pen to hover over then out of the purple box nested in the black box. Or with touch, tap on the purple box. + </div> + --> + <div id="parent0"> + <div id="target0"></div> + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_mouse-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_mouse-manual.html new file mode 100644 index 000000000..042f7a8cd --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_mouse-manual.html @@ -0,0 +1,56 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Dispatch pointerleave (mouse). </title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="When a pointing device that has continuous position (such as a mouse) leaves the hit test boundaries of an element, the pointerleave event must be dispatched."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerleave event"); // set up test harness; + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerleave", function (event) { + detected_pointertypes[event.pointerType] = true; + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.pointerType, "mouse", "Test should be run using a mouse as input."); + assert_equals(event.type, "pointerleave", "The " + event.type + " event was received."); + }); + test_pointerEvent.done(); // complete test + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointerleave (mouse)</h1> + <!-- + <h4> + Test Description: + When a pointing device that has continuous position (such as a mouse) leaves the hit test boundaries of an element, the pointerleave event must be dispatched. + </h4> + <br /> + --> + <div id="target0"> + Use a mouse to move over then out of this element + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_pen-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_pen-manual.html new file mode 100644 index 000000000..b5ff230e8 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_pen-manual.html @@ -0,0 +1,59 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Dispatch pointerleave (pen). </title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="When a pointing device that supports hover (pen stylus) leaves the range of the digitizer while over an element, the pointerleave event must be dispatched."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerleave event"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerleave", function (event) { + detected_pointertypes[event.pointerType] = true; + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.pointerType, "pen", "Test should be run using a pen as input"); + assert_equals(event.type, "pointerleave", "The " + event.type + " event was received"); + assert_true((event.clientX > target0.getBoundingClientRect().left)&& + (event.clientX < target0.getBoundingClientRect().right)&& + (event.clientY > target0.getBoundingClientRect().top)&& + (event.clientY < target0.getBoundingClientRect().bottom), + "pointerleave should be received inside of target bounds"); + }); + test_pointerEvent.done(); // complete test + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointerleave (pen)</h1> + <h4> + Test Description: + When a pointing device that supports hover (pen stylus) leaves the range of the digitizer while over an element, the pointerleave event must be dispatched. + </h4> + <br /> + <div id="target0"> + Use a pen to hover over then lift up away from this element. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerleave_touch-manual.html b/dom/events/test/pointerevents/pointerevent_pointerleave_touch-manual.html new file mode 100644 index 000000000..1dc35c709 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerleave_touch-manual.html @@ -0,0 +1,54 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Dispatch pointerleave (touch). </title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="When a pointing device that does not support hover (such as a finger) leaves the hit test boundaries as a result of a pointerup event, the pointerleave event must be dispatched. "/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerleave event"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerleave", function (event) { + detected_pointertypes[event.pointerType] = true; + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.pointerType, "touch", "Test should be run using touch input"); + assert_equals(event.type, "pointerleave", "The " + event.type + " event received"); + }); + test_pointerEvent.done(); // complete test + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointerleave (touch)</h1> + <h4> + Test Description: + When a pointing device that does not support hover (such as a finger) leaves the hit test boundaries as a result of a pointerup event, the pointerleave event must be dispatched. + </h4> + <br /> + <div id="target0"> + Use touch to tap on this box. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointermove-manual.html b/dom/events/test/pointerevents/pointerevent_pointermove-manual.html new file mode 100644 index 000000000..2d55cfead --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointermove-manual.html @@ -0,0 +1,45 @@ +<!doctype html> +<html> + <head> + <title>Pointermove</title> + <meta name="viewport" content="width=device-width"> + <meta name="assert" content="When a pointer changes coordinates, the pointermove event must be dispatched."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h2>PointerMove</h2> + <h4>Test Description: This test checks if pointermove event triggers. Move your mouse over the black rectangle or slide it if you are using touchscreen.</h4> + <div id="target0" style="background:black"></div> + <script> + var eventTested = false; + var detected_pointertypes = {}; + var test_pointermove = async_test("pointermove event received"); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + // When a pointer changes coordinates, the pointermove event must be dispatched. + // TA: 5.3 + on_event(target0, "pointermove", function (event) { + detected_pointertypes[event.pointerType] = true; + if (eventTested == false) { + test_pointermove.done(); + eventTested = true; + } + }); + } + </script> + <h1>Pointer Events pointermove Tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointermove-on-chorded-mouse-button.html b/dom/events/test/pointerevents/pointerevent_pointermove-on-chorded-mouse-button.html new file mode 100644 index 000000000..7db3dcddd --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointermove-on-chorded-mouse-button.html @@ -0,0 +1,77 @@ +<!doctype html> +<html> + <head> + <title>Pointermove on button state changes</title> + <meta name="viewport" content="width=device-width"> + <meta name="assert" content="When a pointer changes button state and does not produce a different event, the pointermove event must be dispatched."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h2>PointerMove</h2> + <h4>Test Description: This test checks if pointermove event are triggered by button state changes + <ol> + <li>Put your mouse over the black rectangle</li> + <li>Press a button and hold it</li> + <li>Press a second button</li> + <li>Release the second button</li> + <li>Release the first button to complete the test</li> + </ol> + </h4> + <div id="target0" style="background:black"></div> + <script> + var eventTested = false; + var detected_pointertypes = {}; + var test_pointermove = async_test("pointermove events received for button state changes"); + add_completion_callback(showPointerTypes); + + var step = 0; + var firstButton = 0; + + function run() { + var target0 = document.getElementById("target0"); + + // When a pointer changes button state and the circumstances produce no other pointer event, the pointermove event must be dispatched. + // 5.2.6 + + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[event.pointerType] = true; + test_pointermove.step(function() {assert_true(step === 0, "There must not be more than one pointer down event.");}); + if (step == 0) { + step = 1; + firstButton = event.buttons; + } + }); + on_event(target0, "pointermove", function (event) { + detected_pointertypes[event.pointerType] = true; + + if (step == 1 && event.button != -1) { // second button pressed + test_pointermove.step(function() {assert_true(event.buttons !== firstButton, "The pointermove event must be triggered by pressing a second button.");}); + test_pointermove.step(function() {assert_true((event.buttons & firstButton) != 0, "The first button must still be reported pressed.");}); + step = 2; + } else if (step == 2 && event.button != -1) { // second button released + test_pointermove.step(function() {assert_true(event.buttons === firstButton, "The pointermove event must be triggered by releasing the second button.");}); + step = 3; + } + }); + on_event(target0, "pointerup", function (event) { + detected_pointertypes[event.pointerType] = true; + test_pointermove.step(function() {assert_true(step === 3, "The pointerup event must be triggered after pressing and releasing the second button.");}); + test_pointermove.step(function() {assert_true(event.buttons === 0, "The pointerup event must be triggered by releasing the last pressed button.");}); + test_pointermove.done(); + eventTested = true; + }); + } + </script> + <h1>Pointer Events pointermove on button state changes Tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html b/dom/events/test/pointerevents/pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html new file mode 100644 index 000000000..04c4c93ed --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html @@ -0,0 +1,73 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: pointermove has same isPrimary as last pointerdown with the same pointerId</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="The isPrimary attribute of a pointermove event must have the same value as the isPrimary attribute of the last pointerdown event with the same pointerId attribute."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointermove has same isPrimary as last pointerdown"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var pointermove_event = null; + var pointerdown_event = null; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointermove", function (event) { + if (pointerdown_event != null) { + test_pointerEvent.step(function () { + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointermove.pointerId should be the same as pointerdown.pointerId."); + assert_equals(event.isPrimary, pointerdown_event.isPrimary, "pointermove.isPrimary should be the same as pointerdown.isPrimary."); + }); + pointermove_event = event; + } + }); + + on_event(target0, "pointerdown", function (event) { + pointerdown_event = event; + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, "pointerup", function (event) { + test_pointerEvent.step(function () { + assert_not_equals(pointermove_event, null, "pointermove event was never received: "); + }); + test_pointerEvent.done(); // complete test + }); + } + </script> + </head> + <body onload="run()"> + <!-- + <h1>Pointer Event: pointermove has the same isPrimary as last pointerdown with the same pointerId</h1> + <h4>Test Description: + The isPrimary attribute of a pointermove event must have the same value as the isPrimary attribute of the last pointerdown event with the same pointerId attribute. + </h4> + <div id="instructions"> + Press and hold a mouse button, touch contact or pen contact on this element. Move around inside the element while maintaining contact/button down. Only use one device per test run. + <p>Lift off of the element to complete the test.</p> + </div> + --> + <div id="target0" style="touch-action: none;"> + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointermove_pointertype-manual.html b/dom/events/test/pointerevents/pointerevent_pointermove_pointertype-manual.html new file mode 100644 index 000000000..5db76ac1e --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointermove_pointertype-manual.html @@ -0,0 +1,67 @@ +<!doctype html> +<html> + <head> + <title>pointerType conservation</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <!-- + <h1>pointerType conservation</h1> + <h4>Test Description: This test checks if pointerType attribute defined properly.</h4> + <div id="instructions"> + Press and move a mouse button, touch contact or pen contact on the black rectangle. Only use one device per test run. + </div> + <p>Note: This test may be run with different pointer devices, however only one device should be used per test run. + <p> + --> + <div id="target0"></div> + <script> + var eventTested = false; + var pointerTypeGot = false; + var pointerdown_event; + var detected_pointertypes = {}; + + setup({ explicit_done: true }); + + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerover", function(event) { + detected_pointertypes[ event.pointerType ] = true; + }); + + // The pointerType attribute of a pointermove event must have the same value as the pointerType attribute of the last pointerdown event with the same pointerId attribute. + // TA: 5.1 + on_event(target0, "pointerdown", function (event) { + pointerdown_event = event; + pointerTypeGot = true; + }); + + on_event(target0, "pointermove", function (event) { + if(pointerTypeGot == true) { + if(!eventTested) { + test(function() { + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointer IDs are equal: "); + assert_equals(event.pointerType, pointerdown_event.pointerType, "pointerType of pointermove event matches pointerdown event: "); + }, "pointerType is dispatched properly"); + } + done(); + } + }); + } + </script> + <h1>Pointer Events pointerType conservation tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerout-manual.html b/dom/events/test/pointerevents/pointerevent_pointerout-manual.html new file mode 100644 index 000000000..eb8a820ea --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerout-manual.html @@ -0,0 +1,47 @@ +<!doctype html> +<html> + <head> + <title>pointerout</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h2>pointerout</h2> + <h4>Test Description: This test checks if pointerout event triggers. Put your mouse over the black rectangle and then move it out of the rectangle boundaries. If you are using touchscreen tap the black rectangle. </h4> + <div id="target0" style="background: black"></div> + <script> + var test_pointerEvent = async_test("pointerout event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var eventTested = false; + var detected_pointertypes = {}; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerout", function (event) { + detected_pointertypes[event.pointerType] = true; + if (eventTested == false) { + eventTested = true; + check_PointerEvent(event); + test_pointerEvent.done(); + } + }); + } + </script> + <h1>Pointer Events pointerout tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerout_after_pointercancel_touch-manual.html b/dom/events/test/pointerevents/pointerevent_pointerout_after_pointercancel_touch-manual.html new file mode 100644 index 000000000..63cdcb057 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerout_after_pointercancel_touch-manual.html @@ -0,0 +1,68 @@ +<!doctype html> +<html> + <head> + <title>pointerout</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body class="scrollable" onload="run()"> + <h2>pointerout</h2> + <h4>Test Description: This test checks if pointerout event triggers after pointercancel. Start touch on the black rectangle and move your touch to scroll in any direction. </h4> + <p>Note: this test is for touch devices only</p> + <div id="target0"></div> + <script> + var test_pointerout = async_test("pointerout event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var eventTested = false; + var pointercancel_event = null; + var detected_pointertypes = {}; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointercancel", function (event) { + detected_pointertypes[event.pointerType] = true; + pointercancel_event = event; + }); + + // After firing the pointercancel event the pointerout event must be dispatched. + // TA: 4.3 + on_event(target0, "pointerout", function (event) { + if(event.pointerType == 'touch') { + if(pointercancel_event != null) { + if (eventTested == false) { + test_pointerout.step(function() { + assert_equals(event.pointerType, pointercancel_event.pointerType, "pointerType is same for pointercancel and pointerout"); + assert_equals(event.isPrimary, pointercancel_event.isPrimary, "isPrimary is same for pointercancel and pointerout"); + }); + eventTested = true; + test_pointerout.done(); + } + } + else { + test_pointerout.step(function() { + assert_true(false, + "pointercancel received before pointerout"); + }, "pointercancel received before pointerout"); + } + } + }); + } + + </script> + <h1>Pointer Events pointerout tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointerout_after_pointerup_nohover-manual.html b/dom/events/test/pointerevents/pointerevent_pointerout_after_pointerup_nohover-manual.html new file mode 100644 index 000000000..025023d33 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerout_after_pointerup_nohover-manual.html @@ -0,0 +1,68 @@ +<!doctype html> +<html> + <head> + <title>pointerout</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h2>pointerout</h2> + <h4>Test Description: This test checks if pointerout event triggers for devices that don't support hover. Tap the black rectangle. </h4> + <p>Note: this test is only for devices that do not support hover.</p> + <div id="target0"></div> + <script> + var test_pointerout = async_test("pointerout event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var eventTested = false; + var pointerup_event = null; + var detected_pointertypes = {}; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerup", function (event) { + detected_pointertypes[event.pointerType] = true; + pointerup_event = event; + }); + + // For input devices that do not support hover, a pointerout event must follow the pointerup event. + // TA: 3.6 + on_event(target0, "pointerout", function (event) { + if(event.pointerType == 'touch') { + if(pointerup_event != null) { + if(eventTested == false) { + test_pointerout.step(function() { + assert_equals(event.pointerType, pointerup_event.pointerType, "pointerType is same for pointerup and pointerout"); + assert_equals(event.isPrimary, pointerup_event.isPrimary, "isPrimary is same for pointerup and pointerout"); + }); + eventTested = true; + test_pointerout.done(); + } + } + else { + test_pointerout.step(function() { + assert_true(false, + "pointerup received before pointerout"); + }, "pointerup received before pointerout"); + } + } + }); + } + + </script> + <h1>Pointer Events pointerout tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_pointerout_pen-manual.html b/dom/events/test/pointerevents/pointerevent_pointerout_pen-manual.html new file mode 100644 index 000000000..ba58b5503 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerout_pen-manual.html @@ -0,0 +1,58 @@ +<!doctype html> +<html> + <head> + <title>pointerout</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h2>pointerout</h2> + <h4>Test Description: This test checks if pointerout event triggers for pen. Place your pen over the black rectangle and then pull the pen out of the digitizer's detectable range. </h4> + <p>Note: this test is for devices that support hover - for pen only</p> + <div id="target0"></div> + <script> + var test_pointerout = async_test("pointerout event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var eventTested = false; + var isPointerupReceived = false; + var detected_pointertypes = {}; + + function run() { + var target0 = document.getElementById("target0"); + + // When a pen stylus leaves the hover range detectable by the digitizer the pointerout event must be dispatched. + // TA: 7.2 + on_event(target0, "pointerout", function (event) { + detected_pointertypes[event.pointerType] = true; + if(event.pointerType == 'pen') { + if (eventTested == false) { + eventTested = true; + test_pointerout.done(); + } + } + else { + test_pointerout.step(function() { + assert_true(false, + "you have to use pen for this test"); + }, "you have to use pen for this test"); + } + }); + } + + </script> + <h1>Pointer Events pointerout tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerout_received_once-manual.html b/dom/events/test/pointerevents/pointerevent_pointerout_received_once-manual.html new file mode 100644 index 000000000..44191fd47 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerout_received_once-manual.html @@ -0,0 +1,59 @@ +<!doctype html> +<html> + <head> + <title>pointerout received just once</title> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <meta name="viewport" content="width=device-width"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>pointerout received just once</h1> + <h4> + Test Description: This test checks if pointerout event dispatched properly. + <ol> + <li>Put your mouse over the black rectangle. + <li>Move your mouse out of the black rectangle + </ol> + </h4> + <p> + <div id="target0" style="background:black"></div> + <script> + var pointeroutCounter = 0; + var detected_pointertypes = {}; + + setup({ explicit_done: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + // When a mouse passes through dispatches one event + // TA: 7.4 + on_event(target0, "pointerover", function (event) { + pointeroutCounter = 0; + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, "pointerout", function (event) { + pointeroutCounter++; + + setTimeout(function() { + test(function() { + assert_true(pointeroutCounter == 1, "pointerout received just once") + }, "pointerout received just once"); + done(); + }, 5000); + }); + } + </script> + <h1>Pointer Events pointerout received once test</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerover-manual.html b/dom/events/test/pointerevents/pointerevent_pointerover-manual.html new file mode 100644 index 000000000..450ed1a03 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerover-manual.html @@ -0,0 +1,53 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Dispatch pointerover. </title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="When a pointing device is moved into the hit test boundaries of an element, the pointerover event must be dispatched. "/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerover is dispatched"); // set up test harness; + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerover", function (event) { + detected_pointertypes[event.pointerType] = true; + test_pointerEvent.step(function () { + check_PointerEvent(event); + assert_equals(event.type, "pointerover", "Pointer Event received"); + }); + test_pointerEvent.done(); // complete test + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointerover.</h1> + <h4>Test Description: + When a pointing device is moved into the hit test boundaries of an element, the pointerover event must be dispatched. + </h4> + <br /> + <div id="target0"> + Use mouse, touch or pen to hover or contact this element.. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointertype_mouse-manual.html b/dom/events/test/pointerevents/pointerevent_pointertype_mouse-manual.html new file mode 100644 index 000000000..50bd056e3 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointertype_mouse-manual.html @@ -0,0 +1,66 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: If a pointer event is initiated by a mouse device, then the pointerType must be "mouse"</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="If a pointer event is initiated by a mouse device, then the pointerType must be 'mouse'."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointer event have pointerType as mouse"); // set up test harness + var eventTested = false; + + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function eventHandler(event) { + detected_pointertypes[event.pointerType] = true; + if(!eventTested && event.type == "pointerover") { + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.pointerType, "mouse", "Verify event.pointerType is 'mouse'."); + }); + eventTested = true; + } + if (event.type == "pointerup") { + test_pointerEvent.done(); // complete test + } + } + + function run() { + var target0 = document.getElementById("target0"); + + // listen for all events. + for (var i = 0; i < All_Pointer_Events.length; i++) { + on_event(target0, All_Pointer_Events[i], eventHandler); + } + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointer events with pointerType equal to "mouse"</h1> + <!-- + <h4>Test Description: + If a pointer event is initiated by a mouse device, then the pointerType must be 'mouse'. + </h4> + <br /> + --> + <div id="target0"> + Using the mouse, click this element. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointertype_pen-manual.html b/dom/events/test/pointerevents/pointerevent_pointertype_pen-manual.html new file mode 100644 index 000000000..cd018c50e --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointertype_pen-manual.html @@ -0,0 +1,64 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: If a pointer event is initiated by a pen device, then the pointerType must be "pen"</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="If a pointer event is initiated by a pen device, then the pointerType must be 'pen'."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointer event has pointerType as pen"); // set up test harness + var eventTested = false; + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function eventHandler(event) { + detected_pointertypes[event.pointerType] = true; + if(!eventTested) { + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.pointerType, "pen", "Verify event.pointerType is 'pen'."); + }); + eventTested = true; + } + if (event.type == "pointerup") { + test_pointerEvent.done(); // complete test + } + } + + function run() { + var target0 = document.getElementById("target0"); + // listen for all events. + for (var i = 0; i < All_Pointer_Events.length; i++) { + on_event(target0, All_Pointer_Events[i], eventHandler); + } + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointer events with pointerType equal to "pen"</h1> + <!-- + <h4>Test Description: + If a pointer event is initiated by a pen device, then the pointerType must be 'pen'. + </h4> + <br /> + --> + <div id="target0"> + Using pen, tap here. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointertype_touch-manual.html b/dom/events/test/pointerevents/pointerevent_pointertype_touch-manual.html new file mode 100644 index 000000000..d8034573f --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointertype_touch-manual.html @@ -0,0 +1,65 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: If a pointer event is initiated by a touch device, then the pointerType must be "touch"</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="If a pointer event is initiated by a touch device, then the pointerType must be 'touch'."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointer event has pointerType as touch"); // set up test harness + var eventTested = false; + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function eventHandler(event) { + detected_pointertypes[event.pointerType] = true; + if(!eventTested) { + check_PointerEvent(event); + test_pointerEvent.step(function () { + assert_equals(event.pointerType, "touch", "Verify event.pointerType is 'touch'."); + }); + eventTested = true; + } + if (event.type == "pointerup") { + test_pointerEvent.done(); // complete test + } + } + + function run() { + var target0 = document.getElementById("target0"); + + // listen for all events. + for (var i = 0; i < All_Pointer_Events.length; i++) { + on_event(target0, All_Pointer_Events[i], eventHandler); + } + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Dispatch pointer events with pointerType equal to "touch"</h1> + <!-- + <h4>Test Description: + If a pointer event is initiated by a touch device, then the pointerType must be 'touch'. + </h4> + <br /> + --> + <div id="target0"> + Using touch, tap here. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerup-manual.html b/dom/events/test/pointerevents/pointerevent_pointerup-manual.html new file mode 100644 index 000000000..893a5bd2e --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerup-manual.html @@ -0,0 +1,45 @@ +<!doctype html> +<html> + <head> + <title>pointerup</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>pointerup</h1> + <h4>Test Description: This test checks if pointerup event triggers. Press mouse left button and release it over the black rectangle or tap it if you are using a touchscreen.</h4> + <div id="target0" style="background:black"></div> + <script> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerup event received"); + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerup", function (event) { + detected_pointertypes[event.pointerType] = true; + test_pointerEvent.step(function () { + check_PointerEvent(event); + assert_equals(event.type, "pointerup", "Pointer Event received."); + }); + test_pointerEvent.done(); + }); + } + </script> + <h1>Pointer Events pointerup tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html b/dom/events/test/pointerevents/pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html new file mode 100644 index 000000000..a339b5ffd --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html @@ -0,0 +1,66 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: pointerup has same isPrimary as last pointerdown with the same pointerId</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="The isPrimary attribute of a pointerup event must have the same value as the isPrimary attribute of the last pointerdown event with the same pointerId attribute."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointerup has same isPrimary as last pointerdown"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var pointerup_event = null; + var pointerdown_event = null; + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerup", function (event) { + if (pointerdown_event != null) { + test_pointerEvent.step(function () { + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointerup.pointerId should be the same as pointerdown.pointerId."); + assert_equals(event.isPrimary, pointerdown_event.isPrimary, "pointerup.isPrimary should be the same as pointerdown.isPrimary."); + }); + pointerup_event = event; + test_pointerEvent.done(); // complete test + } + }); + + on_event(target0, "pointerdown", function (event) { + pointerdown_event = event; + detected_pointertypes[event.pointerType] = true; + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: pointerup has the same isPrimary as last pointerdown with the same pointerId</h1> + <!-- + <h4>Test Description: + The isPrimary attribute of a pointerup event must have the same value as the isPrimary attribute of the last pointerdown event with the same pointerId attribute. + </h4> + <div id="instructions"> + Press and release a mouse button, touch contact or pen contact on this element. Only use one device per test run. + </div> + --> + <div id="target0" style="touch-action: none;"> + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_pointerup_pointertype-manual.html b/dom/events/test/pointerevents/pointerevent_pointerup_pointertype-manual.html new file mode 100644 index 000000000..95dc56451 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_pointerup_pointertype-manual.html @@ -0,0 +1,67 @@ +<!doctype html> +<html> + <head> + <title>pointerType conservation</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>pointerType conservation</h1> + <!-- + <h4>Test Description: This test checks if pointerType attribute defined properly.</h4> + <div id="instructions"> + Press and release a mouse button, touch contact or pen contact on the black rectangle. Only use one device per test run. + </div> + <p>Note: This test may be run with different pointer devices, however only one device should be used per test run. + <p> + --> + <div id="target0"></div> + <script> + var eventTested = false; + var pointerTypeGot = false; + var pointerdown_event; + var detected_pointertypes = {}; + + setup({ explicit_done: true }); + + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerover", function(event) { + detected_pointertypes[ event.pointerType ] = true; + }); + + // The pointerType attribute of a pointerup event must have the same value as the pointerType attribute of the last pointerdown event with the same pointerId attribute. + // TA: 3.1 + on_event(target0, "pointerdown", function (event) { + pointerdown_event = event; + pointerTypeGot = true; + }); + + on_event(target0, "pointerup", function (event) { + if(pointerTypeGot == true) { + if(!eventTested) { + test(function() { + assert_equals(event.pointerId, pointerdown_event.pointerId, "pointer IDs are equal: "); + assert_equals(event.pointerType, pointerdown_event.pointerType, "pointerType of pointerup event matches pointerdown event: "); + }, "pointerType is dispatched properly"); + } + done(); + } + }); + } + </script> + <h1>Pointer Events pointerType conservation tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_releasepointercapture_events_to_original_target-manual.html b/dom/events/test/pointerevents/pointerevent_releasepointercapture_events_to_original_target-manual.html new file mode 100644 index 000000000..f4d5573ed --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_releasepointercapture_events_to_original_target-manual.html @@ -0,0 +1,119 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: releasePointerCapture() - subsequent events follow normal hitting testing mechanisms</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <meta name="assert" content="After invoking the releasePointerCapture method on an element, subsequent events for the specified pointer must follow normal hit testing mechanisms for determining the event target"/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("lostpointercapture: subsequent events to target."); // set up test harness + var suppressedEventsFail = false; + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var captured_event; + var f_gotPointerCapture = false; + var f_lostPointerCapture = false; + + function listenerEventHandler(event) { + detected_pointertypes[event.pointerType] = true; + if (event.type == "gotpointercapture") { + f_gotPointerCapture = true; + check_PointerEvent(event); + } + else if (event.type == "lostpointercapture") { + f_lostPointerCapture = true; + f_gotPointerCapture = false; + check_PointerEvent(event); + } + else if(event.type == "pointerover" || event.type == "pointerenter" || event.type == "pointerout" || event.type == "pointerleave") { + if(!suppressedEventsFail) { + test(function() { + assert_true(false, "Suppressed events were received"); + }, "Suppressed events were received"); + suppressedEventsFail = true; + } + } + else if (event.pointerId == captured_event.pointerId) { + if (f_gotPointerCapture && event.type == "pointermove") { + // on first event received for capture, release capture + listener.releasePointerCapture(event.pointerId); + } + else { + // if any other events are received after releaseCapture, then the test fails + test_pointerEvent.step(function () { + assert_true(false, event.target.id + "-" + event.type + " should be handled by target element handler"); + }); + } + } + } + + function targetEventHandler(event) { + if (f_gotPointerCapture) { + if(event.type != "pointerout" && event.type != "pointerleave") { + test_pointerEvent.step(function () { + assert_true(false, "The Target element should not have received any events while capture is active. Event recieved:" + event.type + ". "); + }); + } + } + + if (event.type == "pointerdown") { + // pointerdown event received will be used to capture events. + listener.setPointerCapture(event.pointerId); + captured_event = event; + } + + if (f_lostPointerCapture) { + test_pointerEvent.step(function () { + assert_equals(event.pointerId, captured_event.pointerId, "pointerID is same for event captured and after release"); + }); + if (event.type == "pointerup") { + test_pointerEvent.done(); // complete test + } + } + } + + function run() { + var listener = document.getElementById("listener"); + var target0 = document.getElementById("target0"); + target0.style["touchAction"] = "none"; + + // target0 and listener - handle all events + for (var i = 0; i < All_Pointer_Events.length; i++) { + on_event(target0, All_Pointer_Events[i], targetEventHandler); + on_event(listener, All_Pointer_Events[i], listenerEventHandler); + } + } + </script> + </head> + <body onload="run()"> + <div id="listener"></div> + <h1>Pointer Event: releasePointerCapture() - subsequent events follow normal hitting testing mechanisms</h1> + <!-- + <h4> + Test Description: + After invoking the releasePointerCapture method on an element, subsequent events for the specified + pointer must follow normal hit testing mechanisms for determining the event target + </h4> + <br /> + --> + <div id="target0"> + Use mouse, touch or pen to contact here and move around. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_releasepointercapture_invalid_pointerid-manual.html b/dom/events/test/pointerevents/pointerevent_releasepointercapture_invalid_pointerid-manual.html new file mode 100644 index 000000000..e92f2d38a --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_releasepointercapture_invalid_pointerid-manual.html @@ -0,0 +1,79 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: releasePointerCapture DOMException - InvalidPointerId</title> + <meta name="assert" content="releasePointerCapture DOMException - InvalidPointerId"/> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/"/> + <link rel="help" href="http://www.w3.org/wiki/PointerEvents/TestAssertions"> + <meta name="assert" content="When the releasePointerCapture method is invoked, if the provided pointerId value does not match any of the active pointers, a DOMException with the name InvalidPointerId must be thrown."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("releasePointerCapture: DOMException InvalidPointerId"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var invalid_pointerId = 314159265358973923; + + function run() { + var target0 = document.getElementById("target0"); + target0.style["touchAction"] = "none"; + var listener = document.getElementById("listener"); + + // try to release pointer capture with an invalid id + on_event(listener, "pointermove", function (event) { + detected_pointertypes[event.pointerType] = true; + + try { + listener.releasePointerCapture(invalid_pointerId); + + test_pointerEvent.step(function () { + assert_true(false, "DOMException not thrown. Expected: InvalidPointerId should have been thrown"); + }); + } catch (e) { + test_pointerEvent.step(function () { + assert_true(e.name == "InvalidPointerId", "DOMException should be InvalidPointerId"); + }); + } + test_pointerEvent.done(); // complete test + }); + + // set pointer capture + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[event.pointerType] = true; + listener.setPointerCapture(event.pointerId); + }); + } + </script> + </head> + <body onload="run()"> + <div id="listener"></div> + <h1> Pointer Event: releasePointerCapture() DOMException - InvalidPointerId</h1> + <!-- + <h4> + Test Description: + Upon invocation of the releasePointerCapture method, if the provided pointerId value does not match any of the + active pointers, a DOMException with the name InvalidPointerId must be thrown. + </h4> + <br /> + --> + <div id="target0"> + Use the mouse, touch or pen to move over or contact this box. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_releasepointercapture_onpointercancel_touch-manual.html b/dom/events/test/pointerevents/pointerevent_releasepointercapture_onpointercancel_touch-manual.html new file mode 100644 index 000000000..9c6c680ed --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_releasepointercapture_onpointercancel_touch-manual.html @@ -0,0 +1,74 @@ +<!doctype html> +<html> + <head> + <title>Release capture on pointercancel</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body class="scrollable"> + <h1>Pointer Events Capture Test - release capture on pointercancel</h1> + <!-- + <h4> + Test Description: This test checks if setCapture/releaseCapture functions works properly. Complete the following actions: + <ol> + <li> Touch black rectangle and do not release your touch + <li> Move your touch to scroll the page. "lostpointercapture" should be logged inside of the black rectangle immediately after "pointercancel" + </ol> + </h4> + Test passes if the proper behavior of the events is observed. + --> + <div id="target0" style="background:black; color:white"></div> + + <script type='text/javascript'> + var pointercancelGot = false; + var count=0; + var detected_pointertypes = {}; + var test_pointerEvent = async_test("pointer capture is released on pointercancel"); + + var target0 = document.getElementById('target0'); + + add_completion_callback(showPointerTypes); + + window.onload = function() { + on_event(target0, 'pointerdown', function(e) { + detected_pointertypes[e.pointerType] = true; + test_pointerEvent.step(function () { + assert_equals(e.pointerType, "touch", "Test should be run using a touch as input"); + }); + isPointerCapture = true; + sPointerCapture(e); + pointercancelGot = false; + }); + + on_event(target0, 'gotpointercapture', function(e) { + log("gotpointercapture", document.getElementById('target0')); + }); + + // If the setPointerCapture method has been invoked on the pointer specified by pointerId, and the releasePointerCapture method has not been invoked, a lostpointercapture event must be dispatched to the element on which the setPointerCapture method was invoked. Furthermore, subsequent events for the specified pointer must follow normal hit testing mechanisms for determining the event target. + // TA: 4.4 + on_event(target0, 'lostpointercapture', function(e) { + log("lostpointercapture", document.getElementById('target0')); + test_pointerEvent.step(function () { + assert_true(pointercancelGot, "pointercancel was received before lostpointercapture"); + }); + test_pointerEvent.done(); + }); + + on_event(target0, 'pointercancel', function(e) { + log("pointercancel", target0); + pointercancelGot = true; + }); + } + </script> + <h1>Pointer Events Capture Test</h1> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_releasepointercapture_onpointerup_mouse-manual.html b/dom/events/test/pointerevents/pointerevent_releasepointercapture_onpointerup_mouse-manual.html new file mode 100644 index 000000000..7ba33d9be --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_releasepointercapture_onpointerup_mouse-manual.html @@ -0,0 +1,82 @@ +<!doctype html> +<html> + <head> + <title>Release capture on pointerup</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body> + <h1>Pointer Events Capture Test - release capture on pointerup</h1> + <!-- + <h4> + Test Description: This test checks if setCapture/releaseCapture functions works properly. Complete the following actions: + <ol> + <li> Press and hold left mouse button over "Set Capture" button + <li> Release left mouse button anywhere over the document. "lostpointercapture" should be logged inside of the black rectangle immediately after "pointerup" + </ol> + </h4> + Test passes if the proper behavior of the events is observed. + --> + <div id="target0" style="background:black; color:white"></div> + <br> + <input type="button" id="btnCapture" value="Set Capture"> + <script type='text/javascript'> + var isPointerCapture = false; + var pointerupGot = false; + var count=0; + + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var target0 = document.getElementById('target0'); + var captureButton = document.getElementById('btnCapture'); + + setup({ explicit_done: true }); + + window.onload = function() { + on_event(captureButton, 'pointerdown', function(e) { + detected_pointertypes[e.pointerType] = true; + if(isPointerCapture == false) { + isPointerCapture = true; + sPointerCapture(e); + pointerupGot = false; + } + }); + + on_event(target0, 'gotpointercapture', function(e) { + log("gotpointercapture", document.getElementById('target0')); + }); + + // If the setPointerCapture method has been invoked on the pointer specified by pointerId, + // and the releasePointerCapture method has not been invoked,a lostpointercapture event must be + // dispatched to the element on which the setPointerCapture method was invoked. Furthermore, + // subsequent events for the specified pointer must follow normal hit testing mechanisms for + // determining the event target. + // TA: 3.7 + on_event(target0, 'lostpointercapture', function(e) { + test(function() { + assert_true(pointerupGot, "pointerup was received before lostpointercapture") + }, "pointerup was received before lostpointercapture"); + log("lostpointercapture", document.getElementById('target0')); + isPointerCapture = false; + done(); + }); + + on_event(target0, 'pointerup', function(e) { + log("pointerup", target0); + pointerupGot = true; + }); + } + </script> + <h1>Pointer Events Capture Test</h1> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_releasepointercapture_release_right_after_capture-manual.html b/dom/events/test/pointerevents/pointerevent_releasepointercapture_release_right_after_capture-manual.html new file mode 100644 index 000000000..d5aabddfa --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_releasepointercapture_release_right_after_capture-manual.html @@ -0,0 +1,64 @@ +<!doctype html> +<html> + <head> + <title>Release pointer capture right after setpointercapture</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + var test_setPointerCapture = async_test("Release pointer capture right after setpointercapture"); + + function run() { + var target0 = document.getElementById("target0"); + var target1 = document.getElementById("target1"); + + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[event.pointerType] = true; + target0.setPointerCapture(event.pointerId); + target0.releasePointerCapture(event.pointerId); + assert_equals(target0.hasPointerCapture(e.pointerId), false, "After target0.releasePointerCapture, target0.hasPointerCapture should be false"); + }); + + on_event(target0, "gotpointercapture", function (event) { + test_setPointerCapture.step(function () { + assert_true(false, "target0 shouldn't receive gotpointercapture"); + }); + }); + + on_event(target0, "lostpointercapture", function (event) { + test_setPointerCapture.step(function () { + assert_true(false, "target0 shouldn't receive lostpointercapture"); + }); + }); + + on_event(target0, "pointerup", function (event) { + test_setPointerCapture.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Release pointer capture right after setpointercapture</h1> + <!-- + <h4>Test Description: + When calling releasePointer right after setPointerCapture method is invoked, the pending pointer capture should be cleared and no element should receive gotpointercapture and lostpointercapture events + <ol> + <li>Press and hold left mouse button over black box + <li>Move mouse and release mouse button + </ol> + </h4> + --> + <br> + <div id="target0" touch-action:none></div> + <div id="target1" touch-action:none></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_setpointercapture_disconnected-manual.html b/dom/events/test/pointerevents/pointerevent_setpointercapture_disconnected-manual.html new file mode 100644 index 000000000..00875693e --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_setpointercapture_disconnected-manual.html @@ -0,0 +1,58 @@ +<!doctype html> +<html> + <head> + <title>setPointerCapture() throws on disconnected node</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + var test_setPointerCapture = async_test("setPointerCapture: DOMException InvalidStateError"); + + function run() { + var target0 = document.getElementById("target0"); + var target1 = document.getElementById("target1"); + + target1.parentNode.removeChild(target1); + + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[ event.pointerType ] = true; + try { + target1.setPointerCapture(event.pointerId); + + test_setPointerCapture.step(function() { + assert_unreached("DOMException: InvalidStateError should have been thrown."); + }); + } catch (e) { + // TA: 13.4 + test_setPointerCapture.step(function() { + assert_equals(e.name, "InvalidStateError", "DOMException should be InvalidStateError"); + }); + } + test_setPointerCapture.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: DOMException InvalidStateError</h1> + <!-- + <h4>Test Description: + When the setPointerCapture method is invoked, if the target node does not participate in its ownerDocument's tree, a DOMException with the name InvalidStateError must be thrown. + </h4> + <br> + --> + <div id="target0"> + Use the mouse, touch or pen to contact this box. + </div> + <div id="target1"></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_setpointercapture_inactive_button_mouse-manual.html b/dom/events/test/pointerevents/pointerevent_setpointercapture_inactive_button_mouse-manual.html new file mode 100644 index 000000000..72504bc3b --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_setpointercapture_inactive_button_mouse-manual.html @@ -0,0 +1,61 @@ +<!doctype html> +<html> + <head> + <title>setPointerCapture + inactive button state</title> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <meta name="viewport" content="width=device-width"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body onload="run()"> + <h1>setPointerCapture</h1> + <!-- + <h4> + Test Description: This test checks if setPointerCapture works properly. + <ol> + <li>Put your mouse over the black rectangle + <li>Move you mouse out to complete the test + </ol> + </h4> + <p> + --> + <div id="target0" style="background:black; color:white;"></div> + <script> + var detected_pointertypes = {}; + + var captureGot = false; + + setup({ explicit_done: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + on_event(target0, "pointerover", function (event) { + detected_pointertypes[event.pointerType] = true; + target0.setPointerCapture(event.pointerId); + }); + + // When the setPointerCapture method is invoked, if the specified pointer is not in active button state, then the method must have no effect on subsequent pointer events. + // TA: 13.2 + on_event(target0, "pointerout", function (event) { + test(function() { + assert_false(captureGot, "pointer capture is not set while button state is inactive") + }, "pointer capture is not set while button state is inactive"); + done(); + }); + + on_event(target0, 'gotpointercapture', function(e) { + captureGot = true; + }); + } + </script> + <h1>Pointer Events setPointerCapture Tests</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_setpointercapture_invalid_pointerid-manual.html b/dom/events/test/pointerevents/pointerevent_setpointercapture_invalid_pointerid-manual.html new file mode 100644 index 000000000..711afc615 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_setpointercapture_invalid_pointerid-manual.html @@ -0,0 +1,68 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: gotPiontercapture is fired first.</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/wiki/PointerEvents/TestAssertions"> + <meta name="assert" content="When the setPointerCapture method is invoked, if the provided pointerId value does not match any of the active pointers, a DOMException with the name InvalidPointerId must be thrown." /> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <!-- /resources/testharness.js --> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <!-- Additional helper script for common checks across event types --> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + var test_pointerEvent = async_test("setPointerCapture: DOMException InvalidPointerId"); // set up test harness + // showPointerTypes is defined in pointerevent_support.js + // Requirements: the callback function will reference the test_pointerEvent object and + // will fail unless the async_test is created with the var name "test_pointerEvent". + add_completion_callback(showPointerTypes); + + var INVALID_POINTERID = -39548; + + function run() { + var target0 = document.getElementById("target0"); + target0.style["touchAction"] = "none"; + var listener = document.getElementById("complete-notice"); + + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[event.pointerType] = true; + + try { + listener.setPointerCapture(INVALID_POINTERID); + + test_pointerEvent.step(function () { + assert_true(false, "DOMException: InvalidPointerId should have been thrown."); + }); + } catch (e) { + test_pointerEvent.step(function () { + assert_equals(e.name, "InvalidPointerId", "DOMException should be InvalidPointerId"); + }); + } + test_pointerEvent.done(); // complete test + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: DOMException InvalidPointerId</h1> + <!-- + <h4>Test Description: + When the setPointerCapture method is invoked, if the provided pointerId value does not match any of the active pointers, a DOMException with the name InvalidPointerId must be thrown. + </h4> + <br /> + --> + <div id="target0"> + Use the mouse, touch or pen to contact this box. + </div> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_setpointercapture_override_pending_capture_element-manual.html b/dom/events/test/pointerevents/pointerevent_setpointercapture_override_pending_capture_element-manual.html new file mode 100644 index 000000000..e4bf4ddea --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_setpointercapture_override_pending_capture_element-manual.html @@ -0,0 +1,66 @@ +<!doctype html> +<html> + <head> + <title>Test overriding the pending pointer capture element</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + var test_setPointerCapture = async_test("setPointerCapture: override the pending pointer capture element"); + + function run() { + var target0 = document.getElementById("target0"); + var target1 = document.getElementById("target1"); + + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[event.pointerType] = true; + target0.setPointerCapture(event.pointerId); + test_setPointerCapture.step(function () { + assert_equals(target0.hasPointerCapture(event.pointerId), true, "Set capture to target0, target0.hasPointerCapture should be true"); + }); + target1.setPointerCapture(event.pointerId); + test_setPointerCapture.step(function () { + assert_equals(target0.hasPointerCapture(event.pointerId), false, "Set capture to target1, target0.hasPointerCapture should be false"); + assert_equals(target1.hasPointerCapture(event.pointerId), true, "Set capture to target1, target1.hasPointerCapture should be true"); + }); + }); + + on_event(target0, "gotpointercapture", function (event) { + assert_true(false, "target0 shouldn't receive gotpointercapture"); + }); + + on_event(target1, "gotpointercapture", function (event) { + assert_true(true, "target1 should receive gotpointercapture"); + }); + + on_event(target1, "pointerup", function (event) { + test_setPointerCapture.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: Test overriding the pending pointer capture element</h1> + <!-- + <h4>Test Description: + After an element setPointerCapture, if another element also setPointerCapture and override it, the old pending pointer capture element shouldn't receive any gotpointercapture or lostpointercapture event + <ol> + <li>Press and hold left mouse button over black box + <li>Move mouse and release mouse button + </ol> + </h4> + --> + <br> + <div id="target0" touch-action:none></div> + <div id="target1" touch-action:none></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_setpointercapture_relatedtarget-manual.html b/dom/events/test/pointerevents/pointerevent_setpointercapture_relatedtarget-manual.html new file mode 100644 index 000000000..ede53af5d --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_setpointercapture_relatedtarget-manual.html @@ -0,0 +1,103 @@ +<!doctype html> +<html> + <head> + <title>Set/Release capture + relatedTarget</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + </head> + <body> + <!-- + <h1>Pointer Events Capture Test - capture and relatedTarget</h1> + <h4> + Test Description: This test checks if setCapture/releaseCapture functions works properly. Complete the following actions: + <ol> + <li> Put your mouse over the lower rectangle. pointerover should be received for the purple rectangle + <li> Press and hold left mouse button over "Set Capture" button + <li> Put your mouse over the upper rectangle. pointerover should be received for the black rectangle + <li> Release left mouse button to complete the test. + </ol> + </h4> + Test passes if the proper behavior of the events is observed. + --> + <div id="target0" style="background:black; color:white"></div> + <br> + <div id="target1" style="background:purple; color:white"></div> + <br> + <input type="button" id="btnCapture" value="Set Capture"> + <script type='text/javascript'> + var isPointerCapture = false; + var isPointeroverGot = false; + var count=0; + + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var target0 = document.getElementById('target0'); + var target1 = document.getElementById('target1'); + var captureButton = document.getElementById('btnCapture'); + + setup({ explicit_done: true }); + + window.onload = function() { + on_event(captureButton, 'pointerdown', function(e) { + if(isPointerCapture == false) { + isPointerCapture = true; + sPointerCapture(e); + } + else { + isPointerCapture = false; + rPointerCapture(e); + } + }); + + on_event(target0, 'gotpointercapture', function(e) { + log("gotpointercapture", document.getElementById('target0')); + }); + + on_event(target0, 'lostpointercapture', function(e) { + log("lostpointercapture", document.getElementById('target0')); + isPointerCapture = false; + }); + + run(); + } + + function run() { + // After invoking the setPointerCapture method on an element, subsequent pointer events for the specified pointer must be targeted at that element. + // Additionally, the relatedTarget property of all such pointer events must be set to null. + // TA: 13.3 + on_event(target0, "pointerover", function (event) { + log("pointerover", document.getElementById('target0')); + if(isPointerCapture && isPointeroverGot) { + test(function() { + assert_true(event.relatedTarget==null, "relatedTarget is null when the capture is set") + }, "relatedTarget is null when the capture is set. relatedTarget is " + event.relatedTarget); + done(); + } + }); + + on_event(target1, "pointerover", function (event) { + detected_pointertypes[ event.pointerType ] = true; + if(!isPointeroverGot) { + test(function() { + assert_true(isPointerCapture==false, "pointerover shouldn't trigger for this target when capture is enabled"); + }, "pointerover shouldn't trigger for the purple rectangle while the black rectangle has capture"); + isPointeroverGot = true; + log("pointerover", document.getElementById('target1')); + } + }); + } + </script> + <h1>Pointer Events Capture Test</h1> + <div id="complete-notice"> + <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>Refresh the page to run the tests again with a different pointer type.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_setpointercapture_to_same_element_twice-manual.html b/dom/events/test/pointerevents/pointerevent_setpointercapture_to_same_element_twice-manual.html new file mode 100644 index 000000000..248c54818 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_setpointercapture_to_same_element_twice-manual.html @@ -0,0 +1,65 @@ +<!doctype html> +<html> + <head> + <title>setPointerCapture() to the element which already captured the pointer</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script src="pointerevent_support.js"></script> + <script src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + var test_setPointerCapture = async_test("setPointerCapture: set to the element which already captured the pointer"); + var got_pointer_capture = false; + + function run() { + var target0 = document.getElementById("target0"); + var target1 = document.getElementById("target1"); + + on_event(target0, "pointerdown", function (event) { + detected_pointertypes[event.pointerType] = true; + target0.setPointerCapture(event.pointerId); + }); + + on_event(target0, "gotpointercapture", function (event) { + test_setPointerCapture.step(function () { + assert_equals(got_pointer_capture, false, "Target0 should receive gotpointercapture at the first time it captured the pointer"); + assert_equals(target0.hasPointerCapture(event.pointerId), true, "Target 0 received gotpointercapture, target0.hasPointerCapture should be true"); + }); + got_pointer_capture = true; + + target0.setPointerCapture(event.pointerId); + test_setPointerCapture.step(function () { + assert_equals(target0.hasPointerCapture(event.pointerId), true, "Set capture to target0, target0.hasPointerCapture should be true"); + assert_equals(target1.hasPointerCapture(event.pointerId), false, "Set capture to target0, target1.hasPointerCapture should be false"); + }); + }); + + on_event(target0, "pointerup", function (event) { + test_setPointerCapture.done(); + }); + } + </script> + </head> + <body onload="run()"> + <h1>Pointer Event: setPointerCapture to the element which already captured the pointer</h1> + <!-- + <h4>Test Description: + When the setPointerCapture method is invoked, if the target element had already captured the pointer, it should not trigger any gotpointercapture or lostpointercapture event + <ol> + <li>Press and hold left mouse button over black box + <li>Move mouse and release mouse button + </ol> + </h4> + --> + <br> + <div id="target0" touch-action:none></div> + <div id="target1" touch-action:none></div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_styles.css b/dom/events/test/pointerevents/pointerevent_styles.css new file mode 100644 index 000000000..d2acf940d --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_styles.css @@ -0,0 +1,93 @@ +.spacer { +height: 100px; +} + +#square1 { +background: black; +top: 150px; +left: 100px; +} + +.square { +height: 20px; +width: 20px; +position: absolute; +padding: 0px; +} + +#target0 { +background: black; +color: white; +white-space: nowrap; +overflow-y: auto; +overflow-x: auto; +} + +#target1 { +background: purple; +color: white; +white-space: nowrap; +overflow-y: auto; +overflow-x: auto; +} + +.touchActionNone { +touch-action: none; +} + +#innerframe { +width: 90%; +margin: 10px; +margin-left: 10%; +height: 200px; +} + +.scroller { +width: 700px; +height: 430px; +margin: 20px; +overflow: auto; +background: black; +} + +.scroller > div { +height: 1000px; +width: 1000px; +color: white; +} + +.scroller > div div { +height: 100%; +width: 100%; +color: white; +} + +div { +margin: 0em; +padding: 2em; +} + +#complete-notice { +background: #afa; +border: 1px solid #0a0; +display: none; +} + +#pointertype-log { +font-weight: bold; +} + +#event-log { +font-weight: bold; +} + +#listener { +background: orange; +border: 1px solid orange; +position: absolute; +top: -100px; +} + +body.scrollable { +min-height: 5000px; +} diff --git a/dom/events/test/pointerevents/pointerevent_support.js b/dom/events/test/pointerevents/pointerevent_support.js new file mode 100644 index 000000000..4067d53dd --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_support.js @@ -0,0 +1,185 @@ +var All_Pointer_Events = [ + "pointerdown", + "pointerup", + "pointercancel", + "pointermove", + "pointerover", + "pointerout", + "pointerenter", + "pointerleave", + "gotpointercapture", + "lostpointercapture"]; + +// Check for conformance to PointerEvent interface +// TA: 1.1, 1.2, 1.6, 1.7, 1.8, 1.9, 1.10, 1.11, 1.12, 1.13 +function check_PointerEvent(event) { + var pointerTestName = event.pointerType + ' ' + event.type; + test(function () { + assert_true(event instanceof PointerEvent, "event is a PointerEvent event"); + }, pointerTestName + " event is a PointerEvent event"); + + + // Check attributes for conformance to WebIDL: + // * attribute exists + // * has proper type + // * if the attribute is "readonly", it cannot be changed + // TA: 1.1, 1.2 + var idl_type_check = { + "long": function (v) { return typeof v === "number" && Math.round(v) === v; }, + "float": function (v) { return typeof v === "number"; }, + "string": function (v) { return typeof v === "string"; }, + "boolean": function (v) { return typeof v === "boolean" } + }; + [ + ["readonly", "long", "pointerId"], + ["readonly", "float", "width"], + ["readonly", "float", "height"], + ["readonly", "float", "pressure"], + ["readonly", "long", "tiltX"], + ["readonly", "long", "tiltY"], + ["readonly", "string", "pointerType"], + ["readonly", "boolean", "isPrimary"], + ["readonly", "long", "detail", 0] + ].forEach(function (attr) { + var readonly = attr[0]; + var type = attr[1]; + var name = attr[2]; + var value = attr[3]; + + // existence check + test(function () { + assert_true(name in event, name + " attribute in " + event.type + " event"); + }, pointerTestName + "." + name + " attribute exists"); + + // readonly check + if (readonly === "readonly") { + test(function () { + assert_readonly(event.type, name, event.type + "." + name + " cannot be changed"); + }, pointerTestName + "." + name + " is readonly"); + } + + // type check + test(function () { + assert_true(idl_type_check[type](event[name]), name + " attribute of type " + type); + }, pointerTestName + "." + name + " IDL type " + type + " (JS type was " + typeof event[name] + ")"); + + // value check if defined + if (value != undefined) { + test(function () { + assert_equals(event[name], value, name + " attribute value"); + }, pointerTestName + "." + name + " value is " + value + "."); + } + }); + + + // Check the pressure value + // TA: 1.6, 1.7, 1.8 + test(function () { + // TA: 1.6 + assert_greater_than_equal(event.pressure, 0, "pressure is greater than or equal to 0"); + assert_less_than_equal(event.pressure, 1, "pressure is less than or equal to 1"); + + + // TA: 1.7, 1.8 + if (event.pointerType === "mouse") { + if (event.buttons === 0) { + assert_equals(event.pressure, 0, "pressure is 0 for mouse with no buttons pressed"); + } else { + assert_equals(event.pressure, 0.5, "pressure is 0.5 for mouse with a button pressed"); + } + } + }, pointerTestName + ".pressure value is valid"); + + + // Check mouse-specific properties + if (event.pointerType === "mouse") { + // TA: 1.9, 1.10, 1.13 + test(function () { + assert_equals(event.tiltX, 0, event.type + ".tiltX is 0 for mouse"); + assert_equals(event.tiltY, 0, event.type + ".tiltY is 0 for mouse"); + assert_true(event.isPrimary, event.type + ".isPrimary is true for mouse"); + }, pointerTestName + " properties for pointerType = mouse"); + // Check properties for pointers other than mouse + } +} + +function showPointerTypes() { + var complete_notice = document.getElementById("complete-notice"); + var pointertype_log = document.getElementById("pointertype-log"); + var pointertypes = Object.keys(detected_pointertypes); + pointertype_log.innerHTML = pointertypes.length ? + pointertypes.join(",") : "(none)"; + complete_notice.style.display = "block"; +} + +function showLoggedEvents() { + var event_log_elem = document.getElementById("event-log"); + event_log_elem.innerHTML = event_log.length ? event_log.join(", ") : "(none)"; + + var complete_notice = document.getElementById("complete-notice"); + complete_notice.style.display = "block"; +} + +function log(msg, el) { + if (++count > 10){ + count = 0; + el.innerHTML = ' '; + } + el.innerHTML = msg + '; ' + el.innerHTML; +} + + function failOnScroll() { + assert_true(false, + "scroll received while shouldn't"); +} + +function updateDescriptionNextStep() { + document.getElementById('desc').innerHTML = "Test Description: Try to scroll text RIGHT."; +} + +function updateDescriptionComplete() { + document.getElementById('desc').innerHTML = "Test Description: Test complete"; +} + +function updateDescriptionSecondStepTouchActionElement(target, scrollReturnInterval) { + window.setTimeout(function() { + objectScroller(target, 'up', 0);} + , scrollReturnInterval); + document.getElementById('desc').innerHTML = "Test Description: Try to scroll element RIGHT moving your outside of the red border"; +} + +function updateDescriptionThirdStepTouchActionElement(target, scrollReturnInterval) { + window.setTimeout(function() { + objectScroller(target, 'left', 0);} + , scrollReturnInterval); + document.getElementById('desc').innerHTML = "Test Description: Try to scroll element DOWN then RIGHT starting your touch inside of the element. Then tap complete button"; +} + +function updateDescriptionFourthStepTouchActionElement(target, scrollReturnInterval) { + document.getElementById('desc').innerHTML = "Test Description: Try to scroll element RIGHT starting your touch inside of the element"; +} + +function objectScroller(target, direction, value) { + if (direction == 'up') { + target.scrollTop = 0; + } else if (direction == 'left') { + target.scrollLeft = 0; + } +} + +function sPointerCapture(e) { + try { + target0.setPointerCapture(e.pointerId); + } + catch(e) { + } +} + +function rPointerCapture(e) { + try { + captureButton.value = 'Set Capture'; + target0.releasePointerCapture(e.pointerId); + } + catch(e) { + } +} diff --git a/dom/events/test/pointerevents/pointerevent_suppress_compat_events_on_click.html b/dom/events/test/pointerevents/pointerevent_suppress_compat_events_on_click.html new file mode 100644 index 000000000..89508ee92 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_suppress_compat_events_on_click.html @@ -0,0 +1,104 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Suppress compatibility mouse events on click</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Google" href="http://www.google.com "/> + <meta name="assert" content="When a pointerdown is canceled, a click/tap shouldn't fire any compatibility mouse events."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var test_pointerEvent = async_test("Suppress compat mouse events on click"); + add_completion_callback(end_of_test); + + var detected_pointertypes = {}; + var event_log = []; + + function end_of_test() { + showLoggedEvents(); + showPointerTypes(); + } + + function end_of_interaction() { + test(function () { + assert_equals(event_log.join(", "), + "mousedown@target1, mouseup@target1"); + }, "Event log"); + + test_pointerEvent.done(); // complete test + } + + function run() { + on_event(document.getElementById("done"), "click", end_of_interaction); + + var target_list = ["target0", "target1"]; + var pointer_event_list = ["pointerdown"]; + var mouse_event_list = ["mousedown", "mouseup"]; + + target_list.forEach(function(targetId) { + var target = document.getElementById(targetId); + + pointer_event_list.forEach(function(eventName) { + on_event(target, eventName, function (event) { + detected_pointertypes[event.pointerType] = true; + var label = event.type + "@" + targetId; + + test(function () { + assert_true(event.isPrimary); + }, "primary pointer " + label); + + if (label === "pointerdown@target0") + event.preventDefault(); + }); + }); + + mouse_event_list.forEach(function(eventName) { + on_event(target, eventName, function (event) { + event_log.push(event.type + "@" + targetId); + }); + }); + }); + } + </script> + <style> + #target0, #target1 { + margin: 20px; + } + + #done { + margin: 20px; + border: 2px solid black; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Event: Suppress compatibility mouse events on click</h1> + <h4> + When a pointerdown is canceled, a click/tap shouldn't fire any compatibility mouse events. + </h4> + <!-- + <ol> + <li> Click or tap on Target0.</li> + <li> Click or tap on Target1.</li> + <li> Click Done.</li> + </ol> + --> + <div id="target0"> + Target0 + </div> + <div id="target1"> + Target1 + </div> + <div id="done"> + Done + </div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>The following events were logged: <span id="event-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_suppress_compat_events_on_drag_mouse.html b/dom/events/test/pointerevents/pointerevent_suppress_compat_events_on_drag_mouse.html new file mode 100644 index 000000000..337d6ac5f --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_suppress_compat_events_on_drag_mouse.html @@ -0,0 +1,117 @@ +<!doctype html> +<html> + <head> + <title>Pointer Event: Suppress compatibility mouse events on drag</title> + <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/> + <link rel="author" title="Google" href="http://www.google.com "/> + <meta name="assert" content="When a pointerdown is canceled, a mouse drag shouldn't fire any compatibility mouse events."/> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <!--script src="/resources/testharnessreport.js"></script--> + <script type="text/javascript" src="pointerevent_support.js"></script> + <script type="text/javascript" src="mochitest_support_internal.js"></script> + <script type="text/javascript"> + var test_pointerEvent = async_test("Suppress compat mouse events on drag"); + add_completion_callback(end_of_test); + + var detected_pointertypes = {}; + var event_log = []; + + function end_of_test() { + showLoggedEvents(); + showPointerTypes(); + } + + var include_next_mousemove = false; + + // Limits logging/testing of mousemove. + function drop_event(event_type) { + return (event_type == "mousemove" && !include_next_mousemove); + } + + function end_of_interaction() { + test(function () { + assert_equals(event_log.join(", "), + "mousedown@target1, mousemove@target1, mouseup@target1"); + }, "Event log"); + + test_pointerEvent.done(); // complete test + } + + function run() { + on_event(document.getElementById("done"), "click", end_of_interaction); + + var target_list = ["target0", "target1"]; + var pointer_event_list = ["pointerdown"]; + var mouse_event_list = ["mousedown", "mouseup", "mousemove"]; + + target_list.forEach(function(targetId) { + var target = document.getElementById(targetId); + + pointer_event_list.forEach(function(eventName) { + on_event(target, eventName, function (event) { + detected_pointertypes[event.pointerType] = true; + var label = event.type + "@" + targetId; + + test(function () { + assert_true(event.isPrimary); + }, "primary pointer " + label); + + if (label === "pointerdown@target0") + event.preventDefault(); + }); + }); + + mouse_event_list.forEach(function(eventName) { + on_event(target, eventName, function (event) { + if (drop_event(event.type)) + return; + + event_log.push(event.type + "@" + targetId); + + include_next_mousemove = (event.type == "mousedown"); + }); + }); + }); + } + </script> + <style> + #target0, #target1 { + margin: 20px; + touch-action: none; + } + + #done { + margin: 20px; + border: 2px solid black; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Event: Suppress compatibility mouse events on drag</h1> + <!-- + <h4> + When a pointerdown is canceled, a mouse drag shouldn't fire any compatibility mouse events. + </h4> + <ol> + <li> Drag mouse within Target0 & release.</li> + <li> Drag mouse within Target1 & release.</li> + <li> Click Done.</li> + </ol> + --> + <div id="target0"> + Target0 + </div> + <div id="target1"> + Target1 + </div> + <div id="done"> + Done + </div> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + <p>The following events were logged: <span id="event-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html> diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-auto-css_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-auto-css_touch-manual.html new file mode 100644 index 000000000..f5e9d12c3 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-auto-css_touch-manual.html @@ -0,0 +1,129 @@ +<!doctype html> +<html> + <head> + <title>touch-action: auto</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 430px; + touch-action: auto; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll text DOWN. Wait for description update. Expected: pan enabled</h4> + <p>Note: this test is for touch-devices only</p> + <div id="target0"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <script type='text/javascript'> + var detected_pointertypes = {}; + + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + var test_touchaction = async_test("touch-action attribute test"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(target0, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(event.pointerType, "touch", "wrong pointer type was detected: "); + }); + }); + + on_event(target0, 'scroll', function(event) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction.step(function () { + yScrollIsReceived = true; + assert_true(true, "y-scroll received."); + }); + updateDescriptionNextStep(); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction.done(); + updateDescriptionComplete(); + } + }); + } + </script> + <h1>touch-action: auto</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-button-test_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-button-test_touch-manual.html new file mode 100644 index 000000000..8268f2ff7 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-button-test_touch-manual.html @@ -0,0 +1,109 @@ +<!doctype html> +<html> + <head> + <title>Button touch-action test</title> + <meta name="assert" content="TA15.11 -The touch-action CSS property applies to button elements."> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + height: 150px; + width: 200px; + overflow-y: auto; + background: black; + padding: 100px; + position: relative; + } + button { + touch-action: none; + width: 350px; + height: 350px; + border: 2px solid red; + } + </style> + </head> + <body onload="run()"> + <h2>Pointer Events touch-action attribute support</h2> + <h4 id="desc">Test Description: Try to scroll black element DOWN moving your touch outside of the red border. Wait for description update.</h4> + <p>Note: this test is for touch only</p> + <div id="target0"> + <button id="testButton">Test Button</button> + </div> + <br> + <input type="button" id="btnComplete" value="Complete test"> + + <script type='text/javascript'> + var detected_pointertypes = {}; + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + var scrollReturnInterval = 1000; + var isFirstPart = true; + setup({ explicit_timeout: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + //TA 15.11 + var test_touchaction_div = async_test("touch-action attribute test out of element"); + var test_touchaction_button = async_test("touch-action attribute test in element"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(btnComplete, 'click', function(event) { + test_touchaction_button.step(function() { + assert_equals(target0.scrollLeft, 0, "button scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "button scroll y offset should be 0 in the end of the test"); + assert_true(xScrollIsReceived && yScrollIsReceived, "target0 x and y scroll offsets should be greater than 0 after first two interactions (outside red border) respectively"); + }); + test_touchaction_button.done(); + updateDescriptionComplete(); + }); + + on_event(btnComplete, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, 'scroll', function(event) { + if(isFirstPart) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction_div.step(function () { + yScrollIsReceived = true; + }); + updateDescriptionSecondStepTouchActionElement(target0, scrollReturnInterval); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction_div.done(); + updateDescriptionThirdStepTouchActionElement(target0, scrollReturnInterval); + setTimeout(function() { + isFirstPart = false; + }, 2 * scrollReturnInterval); // avoid immediate triggering while scroll is still being performed + } + } + else { + test_touchaction_button.step(failOnScroll, "scroll received while shouldn't"); + } + }); + } + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-illegal.html b/dom/events/test/pointerevents/pointerevent_touch-action-illegal.html new file mode 100644 index 000000000..5fe617984 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-illegal.html @@ -0,0 +1,67 @@ +<!doctype html> +<html> + <head> + <title>touch-action: illegal</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 50px; + touch-action: pan-x none; + } + #target1 { + width: 700px; + height: 50px; + background: black; + margin-top: 5px; + touch-action: pan-y none; + } + #target2 { + width: 700px; + height: 50px; + background: black; + margin-top: 5px; + touch-action: auto none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Test will automatically check behaviour of following combinations: 'pan-x none', 'pan-y none', 'auto none'</h4> + <div id="target0"></div> + <div id="target1"></div> + <div id="target2"></div> + <script type='text/javascript'> + var detected_pointertypes = {}; + + setup({ explicit_done: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById('target0'); + var target1 = document.getElementById('target1'); + var target2 = document.getElementById('target2'); + + test(function() { + assert_true(getComputedStyle(target0).touchAction == 'auto', "'pan-x none' is corrected properly"); + }, "'pan-x none' is corrected properly"); + test(function() { + assert_true(getComputedStyle(target1).touchAction == 'auto', "'pan-y none' is corrected properly"); + }, "'pan-y none' is corrected properly"); + test(function() { + assert_true(getComputedStyle(target2).touchAction == 'auto', "'auto none' is corrected properly"); + }, "'auto none' is corrected properly"); + done(); + } + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-auto-child-none_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-auto-child-none_touch-manual.html new file mode 100644 index 000000000..364c9c11f --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-auto-child-none_touch-manual.html @@ -0,0 +1,117 @@ +<!doctype html> +<html> + <head> + <title>touch-action: parent > child: auto > child: none</title> + <meta name="assert" content="TA15.5 - when a user touches an element, the effect of that touch is determined by the value of the touch-action property and the default touch behaviors on the element and its ancestors. Scrollable-Parent, Child: `auto`, Grand-Child: `none`"> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + .scroller > div { + touch-action: auto; + } + .scroller > div div { + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: no panning.</h4> + <p>Note: this test is for touch-devices only</p> + <div class="scroller" id="target0"> + <div> + <div> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + </div> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var test_touchaction = async_test("touch-action attribute test"); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if touch-action attribute works properly for embedded divs + // Scrollable-Parent, Child: `auto`, Grand-Child: `none` + // TA: 15.5 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(target0.scrollLeft, 0, "scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "scroll y offset should be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + + on_event(target0, 'scroll', function(event) { + test_touchaction.step(failOnScroll, "scroll received while touch-action is none"); + }); + } + </script> + <h1>behaviour: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-none_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-none_touch-manual.html new file mode 100644 index 000000000..786819b85 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-none_touch-manual.html @@ -0,0 +1,112 @@ +<!doctype html> +<html> + <head> + <title>touch-action: child: none</title> + <meta name="assert" content="TA15.9 - when a user touches an element, the effect of that touch is determined by the value of the touch-action property and the default touch behaviors on the element and its ancestors. Scrollable-Parent, Child: `none`"> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + .scroller > div { + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: no panning</h4> + <p>Note: this test is for touch-devices only</p> + <div class="scroller" id="target0"> + <div> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var test_touchaction = async_test("touch-action attribute test"); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if touch-action attribute works properly for embedded divs + // + // TA: 15.9 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(target0.scrollLeft, 0, "scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "scroll y offset should be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + + on_event(target0, 'scroll', function(event) { + test_touchaction.step(failOnScroll, "scroll received while touch-action is none"); + }); + } + </script> + <h1>behaviour: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-pan-x-child-pan-x_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-pan-x-child-pan-x_touch-manual.html new file mode 100644 index 000000000..09a97e3cb --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-pan-x-child-pan-x_touch-manual.html @@ -0,0 +1,112 @@ +<!doctype html> +<html> + <head> + <title>touch-action: parent > child: pan-x > child: pan-x</title> + <meta name="assert" content="TA15.6 - when a user touches an element, the effect of that touch is determined by the value of the touch-action property and the default touch behaviors on the element and its ancestors. Scrollable-Parent, Child: `pan-x`, Grand-Child: `pan-x`"> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + .scroller > div { + touch-action: pan-x; + } + .scroller > div div { + touch-action: pan-x; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: only pans in x direction.</h4> + <p>Note: this test is for touch-devices only</p> + <div class="scroller" id="target0"> + <div> + <div> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + </div> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + var test_touchaction = async_test("touch-action attribute test"); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if touch-action attribute works properly for embedded divs + // + // TA: 15.6 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_not_equals(target0.scrollLeft, 0, "scroll x offset should not be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "scroll y offset should be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + } + </script> + <h1>behaviour: pan-x</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-pan-x-child-pan-y_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-pan-x-child-pan-y_touch-manual.html new file mode 100644 index 000000000..527e55374 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_child-pan-x-child-pan-y_touch-manual.html @@ -0,0 +1,117 @@ +<!doctype html> +<html> + <head> + <title>touch-action: parent > child: pan-x > child: pan-y</title> + <meta name="assert" content="TA15.13 - Touch action inherits child 'pan-x' -> child 'pan-y' test"> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + .scroller > div { + touch-action: pan-x; + } + .scroller > div div { + touch-action: pan-y; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: no panning/zooming/etc.</h4> + <p>Note: this test is for touch-devices only</p> + <div class="scroller" id="target0"> + <div> + <div> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + </div> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var test_touchaction = async_test("touch-action attribute test"); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if touch-action attribute works properly for embedded divs + // Scrollable-Parent, Child: `pan-x`, Grand-Child: `pan-y` + // TA: 15.13 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(target0.scrollLeft, 0, "scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "scroll y offset should be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + + on_event(target0, 'scroll', function(event) { + test_touchaction.step(failOnScroll, "scroll received while touch-action is none"); + }); + } + </script> + <h1>behaviour: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-inherit_highest-parent-none_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_highest-parent-none_touch-manual.html new file mode 100644 index 000000000..b13013c43 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_highest-parent-none_touch-manual.html @@ -0,0 +1,133 @@ +<!doctype html> +<html> + <head> + <title>touch-action: parent: none + two embedded children</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #divParent { + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll text DOWN. Wait for description update. Expected: pan enabled</h4> + <p>Note: this test is for touch-devices only</p> + <div id="divParent"> + <div class="scroller" id="target0"> + <div> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + </div> + </div> + <script type='text/javascript'> + var detected_pointertypes = {}; + + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + + add_completion_callback(showPointerTypes); + add_completion_callback(enableScrolling); + + function run() { + var target0 = document.getElementById("target0"); + + var test_touchaction = async_test("touch-action attribute test"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(target0, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + }); + + // Check if touch-action attribute works properly for embedded divs + // + // TA: 15. + on_event(target0, 'scroll', function(event) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + yScrollIsReceived = true; + updateDescriptionNextStep(); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction.done(); + updateDescriptionComplete(); + } + }); + } + + function enableScrolling() { + document.getElementById('divParent').setAttribute('style', 'touch-action: auto'); + } + </script> + <h1>behaviour: auto</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-inherit_parent-none_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_parent-none_touch-manual.html new file mode 100644 index 000000000..163ef9b8e --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-inherit_parent-none_touch-manual.html @@ -0,0 +1,112 @@ +<!doctype html> +<html> + <head> + <title>touch-action: inherit from parent: none</title> + <meta name="assert" content="TA15.8 - when a user touches an element, the effect of that touch is determined by the value of the touch-action property and the default touch behaviors on the element and its ancestors. Scrollable-Parent: `none` Child: `auto`"> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + .scroller { + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: no panning</h4> + <p>Note: this test is for touch-devices only</p> + <div class="scroller" id="target0"> + <div> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var test_touchaction = async_test("touch-action attribute test"); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if touch-action attribute works properly for embedded divs + // + // TA: 15.8 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(target0.scrollLeft, 0, "scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "scroll y offset should be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + + on_event(target0, 'scroll', function(event) { + test_touchaction.step(failOnScroll, "scroll received while touch-action is none"); + }); + } + </script> + <h1>behaviour: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-keyboard-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-keyboard-manual.html new file mode 100644 index 000000000..3fef3f646 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-keyboard-manual.html @@ -0,0 +1,124 @@ +<!doctype html> +<html> + <head> + <title>touch-action: keyboard</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 430px; + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Press DOWN ARROW key. Wait for description update. Expected: pan enabled</h4> + <p>Note: this test is for keyboard only</p> + <div id="target0"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <script type='text/javascript'> + + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + + function run() { + var target0 = document.getElementById("target0"); + + var test_touchaction = async_test("touch-action attribute test"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + target0.focus(); + + on_event(target0, 'scroll', function(event) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction.step(function () { + yScrollIsReceived = true; + assert_true(true, "y-scroll received."); + }); + updateDescriptionNextStepKeyboard(); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction.done(); + updateDescriptionComplete(); + } + }); + } + + function updateDescriptionNextStepKeyboard() { + document.getElementById('desc').innerHTML = "Test Description: press RIGHT ARROW key."; + } + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-mouse-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-mouse-manual.html new file mode 100644 index 000000000..fcc858451 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-mouse-manual.html @@ -0,0 +1,130 @@ +<!doctype html> +<html> + <head> + <title>touch-action: mouse</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 430px; + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll text down using mouse (use mouse wheel or click on the scrollbar). Wait for description update.</h4> + <p>Note: this test is for mouse only</p> + <div id="target0"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <script type='text/javascript'> + var detected_pointertypes = {}; + + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + var test_touchaction = async_test("touch-action attribute test"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(target0, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, 'scroll', function(event) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction.step(function () { + yScrollIsReceived = true; + assert_true(true, "y-scroll received."); + }); + updateDescriptionNextStepMouse(); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction.done(); + updateDescriptionComplete(); + } + }); + } + + function updateDescriptionNextStepMouse() { + document.getElementById('desc').innerHTML = "Test Description: Try to scroll text right using mouse (use mouse wheel or click on the scrollbar)."; + } + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-none-css_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-none-css_touch-manual.html new file mode 100644 index 000000000..dec694f3e --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-none-css_touch-manual.html @@ -0,0 +1,111 @@ +<!doctype html> +<html> + <head> + <title>touch-action: none</title> + <meta name="assert" content="TA15.2 - With `touch-action: none` on a swiped or click/dragged element, `pointerdown+(optional pointermove)+pointerup` must be dispatched."> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 430px; + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: no panning/zooming/etc.</h4> + <p>Note: this test is for touch-devices only</p> + <div id="target0"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + + var test_touchaction = async_test("touch-action attribute test"); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if "touch-action: none" attribute works properly + //TA: 15.2 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(target0.scrollLeft, 0, "scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "scroll y offset should be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + + on_event(target0, 'scroll', function(event) { + test_touchaction.step(failOnScroll, "scroll received while touch-action is none"); + }); + } + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-css_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-css_touch-manual.html new file mode 100644 index 000000000..e757baec6 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-css_touch-manual.html @@ -0,0 +1,106 @@ +<!doctype html> +<html> + <head> + <title>touch-action: pan-x</title> + <meta name="assert" content="TA15.3 - With `touch-action: pan-x` on a swiped or click/dragged element, only panning on the x-axis should be possible."> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 430px; + touch-action: pan-x; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: only pans in x direction.</h4> + <p>Note: this test is for touch-devices only</p> + <div id="target0"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + var test_touchaction = async_test("touch-action attribute test"); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if "touch-action: pan-x" attribute works properly + //TA: 15.3 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_not_equals(target0.scrollLeft, 0, "scroll x offset should not be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "scroll y offset should be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + } + </script> + <h1>touch-action: pan-x</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-pan-y-pan-y_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-pan-y-pan-y_touch-manual.html new file mode 100644 index 000000000..e89b8b742 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-pan-y-pan-y_touch-manual.html @@ -0,0 +1,111 @@ +<!doctype html> +<html> + <head> + <title>touch-action: parent > child: pan-x pan-y > child: pan-y</title> + <meta name="assert" content="TA15.17 - Touch action 'pan-x pan-y' 'pan-y' test"> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + .scroller > div { + touch-action: pan-x pan-y; + } + .scroller > div div { + touch-action: pan-y; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: only pans in y direction.</h4> + <p>Note: this test is for touch-devices only</p> + <div class="scroller" id="target0"> + <div> + <div> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + </div> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + add_completion_callback(showPointerTypes); + + var test_touchaction = async_test("touch-action attribute test"); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if touch-action attribute works properly for embedded divs + // + // TA: 15.17 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(target0.scrollLeft, 0, "scroll x offset should be 0 in the end of the test"); + assert_not_equals(target0.scrollTop, 0, "scroll y offset should not be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + } + </script> + <h1>behaviour: pan-y</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-pan-y_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-pan-y_touch-manual.html new file mode 100644 index 000000000..0c900ff74 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-pan-x-pan-y_touch-manual.html @@ -0,0 +1,126 @@ +<!doctype html> +<html> + <head> + <title>touch-action: pan-x pan-y</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 430px; + touch-action: pan-x pan-y; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll text DOWN. Wait for description update. Expected: pan enabled</h4> + <p>Note: this test is for touch-devices only</p> + <div id="target0"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <script type='text/javascript'> + var detected_pointertypes = {}; + + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + + var test_touchaction = async_test("touch-action attribute test"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(target0, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, 'scroll', function(event) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction.step(function () { + yScrollIsReceived = true; + assert_true(true, "y-scroll received."); + }); + updateDescriptionNextStep(); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction.done(); + updateDescriptionComplete(); + } + }); + } + </script> + <h1>touch-action: pan-x pan-y</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-pan-y-css_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-pan-y-css_touch-manual.html new file mode 100644 index 000000000..4ad39ecc8 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-pan-y-css_touch-manual.html @@ -0,0 +1,106 @@ +<!doctype html> +<html> + <head> + <title>touch-action: pan-y</title> + <meta name="assert" content="TA15.4 - With `touch-action: pan-y` on a swiped or click/dragged element, only panning in the y-axis should be possible."> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 430px; + touch-action: pan-y; + } + </style> + </head> + <body onload="run()"> + <h1>Pointer Events touch-action attribute support</h1> + <h4 id="desc">Test Description: Try to scroll element DOWN then RIGHT. Tap Complete button under the rectangle when done. Expected: only pans in y direction.</h4> + <p>Note: this test is for touch-devices only</p> + <div id="target0"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem + nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. + Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit + lobortis nisl ut aliquip ex ea commodo consequat. + </p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + <p>Lorem ipsum dolor sit amet...</p> + </div> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + var test_touchaction = async_test("touch-action attribute test"); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + // Check if "touch-action: pan-y" attribute works properly + //TA: 15.4 + on_event(btnComplete, 'click', function(event) { + detected_pointertypes[event.pointerType] = true; + test_touchaction.step(function() { + assert_equals(target0.scrollLeft, 0, "scroll x offset should be 0 in the end of the test"); + assert_not_equals(target0.scrollTop, 0, "scroll y offset should not be 0 in the end of the test"); + }); + test_touchaction.done(); + updateDescriptionComplete(); + }); + } + </script> + <h1>touch-action: pan-y</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-span-test_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-span-test_touch-manual.html new file mode 100644 index 000000000..41635e0bf --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-span-test_touch-manual.html @@ -0,0 +1,113 @@ +<!doctype html> +<html> + <head> + <title>Span touch-action test</title> + <meta name="assert" content="TA15.18 - The touch-action CSS property applies to all elements except non-replaced inline elements." + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + height: 150px; + width: 200px; + overflow-y: auto; + background: black; + padding: 100px; + position: relative; + } + #testspan { + touch-action: none; + font-size: 72pt; + padding: 0px 0px 180px 0px; + border: 2px solid red; + } + </style> + </head> + <body onload="run()"> + <h2>Pointer Events touch-action attribute support</h2> + <h4 id="desc">Test Description: Try to scroll black element DOWN moving your touch outside of the red border. Wait for description update.</h4> + <p>Note: this test is for touch only</p> + <div id="target0"> + <span id="testspan"> + Test span + </span> + </div> + <input type="button" id="btnComplete" value="Complete test"> + + <script type='text/javascript'> + var detected_pointertypes = {}; + + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var failScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + var scrollReturnInterval = 500; + var isFirstPart = true; + setup({ explicit_timeout: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + //TA 15.18 + var test_touchaction_div = async_test("touch-action attribute test out of element"); + var test_touchaction_span = async_test("touch-action attribute test in element"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(btnComplete, 'click', function(event) { + test_touchaction_span.step(function() { + assert_not_equals(target0.scrollLeft, 0, "span scroll x offset should not be 0 in the end of the test"); + assert_not_equals(target0.scrollTop, 0, "span scroll y offset should not be 0 in the end of the test"); + assert_true(!isFirstPart, "target0 x and y scroll offsets should be greater than 0 after first two interactions (outside red border) respectively"); + }); + test_touchaction_span.done(); + updateDescriptionComplete(); + }); + + on_event(btnComplete, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, 'scroll', function(event) { + if(isFirstPart) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction_div.step(function () { + yScrollIsReceived = true; + }); + updateDescriptionSecondStepTouchActionElement(target0, scrollReturnInterval); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction_div.done(); + updateDescriptionThirdStepTouchActionElement(target0, scrollReturnInterval); + setTimeout(function() { + isFirstPart = false; + xScr0 = target0.scrollLeft; + xScr0 = target0.scrollLeft; + xScrollIsReceived = false; + yScrollIsReceived = false; + }, 2 * scrollReturnInterval); // avoid immediate triggering while scroll is still being performed + } + } + }); + } + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-svg-test_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-svg-test_touch-manual.html new file mode 100644 index 000000000..422a72e19 --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-svg-test_touch-manual.html @@ -0,0 +1,122 @@ +<!doctype html> +<html> + <head> + <title>SVG test</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + height: 350px; + width: 300px; + overflow-y: auto; + background: black; + padding: 100px; + position: relative; + } + </style> + </head> + <body onload="run()"> + <h2>Pointer Events touch-action attribute support</h2> + <h4 id="desc">Test Description: Try to scroll black element DOWN moving your touch outside of the red border. Wait for description update.</h4> + <p>Note: this test is for touch only</p> + <div id="target0"> + <svg id="testSvg" width="555" height="555" style="touch-action: none; border: 4px double red;"> + <circle cx="305" cy="305" r="250" stroke="green" stroke-width="4" fill="yellow" /> + Sorry, your browser does not support inline SVG. + </svg> + </div> + <br> + <input type="button" id="btnComplete" value="Complete test"> + <script type='text/javascript'> + var detected_pointertypes = {}; + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + var scrollReturnInterval = 1000; + var isFirstPart = true; + setup({ explicit_timeout: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + var test_touchaction_div = async_test("touch-action attribute test out of SVG"); + var test_touchaction_svg = async_test("touch-action attribute test in SVG"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(btnComplete, 'click', function(event) { + test_touchaction_svg.step(function() { + assert_equals(target0.scrollLeft, 0, "SVG scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "SVG scroll y offset should be 0 in the end of the test"); + }); + test_touchaction_svg.done(); + updateDescriptionComplete(); + }); + + on_event(btnComplete, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, 'scroll', function(event) { + if(isFirstPart) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction_div.step(function () { + yScrollIsReceived = true; + assert_true(true, "y-scroll received."); + }); + updateDescriptionSecondStepSVG(); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction_div.done(); + updateDescriptionThirdStepSVG(); + setTimeout(function() { + isFirstPart = false; + }, 2 * scrollReturnInterval); + } + } + }); + } + + function updateDescriptionSecondStepSVG() { + window.setTimeout(function() { + objectScroller(target0, 'up', 0);} + , scrollReturnInterval); + document.getElementById('desc').innerHTML = "Test Description: Try to scroll element RIGHT moving your touch outside of the red border"; + } + + function updateDescriptionThirdStepSVG() { + window.setTimeout(function() { + objectScroller(target0, 'left', 0);} + , scrollReturnInterval); + document.getElementById('desc').innerHTML = "Test Description: Try to scroll element DOWN then RIGHT starting your touch inside of the circle. Tap Complete button under the rectangle when done"; + } + + function objectScroller(target, direction, value) { + if (direction == 'up') { + target.scrollTop = 0; + } else if (direction == 'left') { + target.scrollLeft = 0; + } + } + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-table-test_touch-manual.html b/dom/events/test/pointerevents/pointerevent_touch-action-table-test_touch-manual.html new file mode 100644 index 000000000..fcc3a3e7c --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-table-test_touch-manual.html @@ -0,0 +1,141 @@ +<!doctype html> +<html> + <head> + <title>Table touch-action test</title> + <meta name="assert" content="TA15.19 The touch-action CSS property applies to all elements except table rows, row groups, table columns, and column groups."> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + height: 150px; + width: 200px; + overflow-y: auto; + background: black; + padding: 100px; + position: relative; + } + #testtable{ + color: white; + width: 350px; + padding: 0px 0px 200px 0px; + border: 2px solid green; + } + .testtd, .testth { + border: 2px solid green; + height: 80px; + } + #row1 { + touch-action: none; + } + #cell3 { + touch-action: none; + } + </style> + </head> + <body onload="run()"> + <h2>Pointer Events touch-action attribute support</h2> + <h4 id="desc">Test Description: Try to scroll element DOWN starting your touch over the 1st Row. Wait for description update.</h4> + <p>Note: this test is for touch only</p> + <div id="target0"> + <table id="testtable"> + <caption>The caption, first row element, and cell 3 have touch-action: none.</caption> + <tr id="row1"><th class="testth">Header 1 <td class="testtd">Cell 1 <td class="testtd">Cell 2</tr> + <tr id="row2"><th class="testth">Header 2 <td id="cell3" class="testtd">Cell 3 <td class="testtd">Cell 4</tr> + <tr id="row3"> <th class="testth">Header 3 <td class="testtd">Cell 5 <td class="testtd"> Cell 6</tr> + </table> + </div> + <br> + <input type="button" id="btnComplete" value="Complete test"> + + <script type='text/javascript'> + var detected_pointertypes = {}; + var xScrollIsReceived = false; + var yScrollIsReceived = false; + var xScr0, yScr0, xScr1, yScr1; + var scrollReturnInterval = 1000; + var isFirstPart = true; + setup({ explicit_timeout: true }); + add_completion_callback(showPointerTypes); + + function run() { + var target0 = document.getElementById("target0"); + var btnComplete = document.getElementById("btnComplete"); + + //TA 15.19 + var test_touchaction_cell = async_test("touch-action attribute test on the cell"); + var test_touchaction_row = async_test("touch-action attribute test on the row"); + + xScr0 = target0.scrollLeft; + yScr0 = target0.scrollTop; + + on_event(btnComplete, 'click', function(event) { + test_touchaction_cell.step(function() { + assert_equals(target0.scrollLeft, 0, "table scroll x offset should be 0 in the end of the test"); + assert_equals(target0.scrollTop, 0, "table scroll y offset should be 0 in the end of the test"); + assert_true(xScrollIsReceived && yScrollIsReceived, "target0 x and y scroll offsets should be greater than 0 after first two interactions (outside red border) respectively"); + }); + test_touchaction_cell.done(); + updateDescriptionComplete(); + }); + + on_event(btnComplete, 'pointerdown', function(event) { + detected_pointertypes[event.pointerType] = true; + }); + + on_event(target0, 'scroll', function(event) { + if(isFirstPart) { + xScr1 = target0.scrollLeft; + yScr1 = target0.scrollTop; + + if(xScr1 != xScr0) { + xScrollIsReceived = true; + } + + if(yScr1 != yScr0) { + test_touchaction_row.step(function () { + yScrollIsReceived = true; + }); + updateDescriptionSecondStepTable(target0, scrollReturnInterval); + } + + if(xScrollIsReceived && yScrollIsReceived) { + test_touchaction_row.done(); + updateDescriptionThirdStepTable(target0, scrollReturnInterval); + setTimeout(function() { + isFirstPart = false; + }, 2 * scrollReturnInterval); // avoid immediate triggering while scroll is still being performed + } + } + else { + test_touchaction_cell.step(failOnScroll, "scroll received while shouldn't"); + } + }); + } + + function updateDescriptionSecondStepTable(target, scrollReturnInterval, element) { + window.setTimeout(function() { + objectScroller(target, 'up', 0); + } + , scrollReturnInterval); + document.getElementById('desc').innerHTML = "Test Description: Try to scroll element RIGHT staring your touch over the Row 1"; + } + + function updateDescriptionThirdStepTable(target, scrollReturnInterval) { + window.setTimeout(function() { + objectScroller(target, 'left', 0); + } + , scrollReturnInterval); + document.getElementById('desc').innerHTML = "Test Description: Try to scroll element DOWN then RIGHT starting your touch inside of the Cell 3"; + } + + </script> + <h1>touch-action: none</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/pointerevent_touch-action-verification.html b/dom/events/test/pointerevents/pointerevent_touch-action-verification.html new file mode 100644 index 000000000..2e694229a --- /dev/null +++ b/dom/events/test/pointerevents/pointerevent_touch-action-verification.html @@ -0,0 +1,101 @@ +<!doctype html> +<html> + <head> + <title>touch-action: basic verification</title> + <meta name="assert" content="TA15.20 - The touch-action CSS property determines whether touch input MAY trigger default behavior supplied by the user agent. + auto: The user agent MAY determine any permitted touch behaviors, such as panning and zooming manipulations of the viewport, for touches that begin on the element. + none: Touches that begin on the element MUST NOT trigger default touch behaviors. + pan-x: The user agent MAY consider touches that begin on the element only for the purposes of horizontally scrolling the element's nearest ancestor with horizontally scrollable content. + pan-y: The user agent MAY consider touches that begin on the element only for the purposes of vertically scrolling the element's nearest ancestor with vertically scrollable content. + manipulation: The user agent MAY consider touches that begin on the element only for the purposes of scrolling and continuous zooming. Any additional behaviors supported by auto are out of scope for this specification."> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="pointerevent_support.js"></script> + <style> + #target0 { + width: 700px; + height: 20px; + touch-action: auto; + } + #target1 { + width: 700px; + height: 20px; + touch-action: none; + background: black; + margin-top: 5px; + touch-action: pan-x; + } + #target2 { + width: 700px; + height: 20px; + touch-action: none; + background: black; + margin-top: 5px; + touch-action: pan-y; + } + #target3 { + width: 700px; + height: 20px; + touch-action: none; + background: black; + margin-top: 5px; + touch-action: none; + } + #target4 { + width: 700px; + height: 20px; + touch-action: none; + background: black; + margin-top: 5px; + touch-action: manipulation; + } + </style> + </head> + <body onload="run()"> + <h2>Pointer Events touch-action attribute support</h2> + <h4 id="desc">Test Description: Test will automatically check behaviour of following values: 'auto', 'pan-x', 'pan-y', ' none', 'manipulation'</h4> + <div id="target0"></div> + <div id="target1"></div> + <div id="target2"></div> + <div id="target3"></div> + <div id="target4"></div> + <script type='text/javascript'> + var detected_pointertypes = {}; + + setup({ explicit_done: true }); + + function run() { + var target0 = document.getElementById('target0'); + var target1 = document.getElementById('target1'); + var target2 = document.getElementById('target2'); + var target3 = document.getElementById('target3'); + var target4 = document.getElementById('target4'); + + //TA 15.20 + test(function() { + assert_true(getComputedStyle(target0).touchAction == 'auto', "'auto' is set properly"); + }, "'auto' is set properly"); + test(function() { + assert_true(getComputedStyle(target1).touchAction == 'pan-x', "'pan-x' is corrected properly"); + }, "'pan-x' is corrected properly"); + test(function() { + assert_true(getComputedStyle(target2).touchAction == 'pan-y', "'pan-y' is set properly"); + }, "'pan-y' is set properly"); + test(function() { + assert_true(getComputedStyle(target3).touchAction == 'none', "'none' is set properly"); + }, "'none' is set properly"); + test(function() { + assert_true(getComputedStyle(target4).touchAction == 'manipulation', "'manipulation' is set properly"); + }, "'manipulation' is set properly"); + done(); + } + </script> + <h1>touch-action: basic verification</h1> + <div id="complete-notice"> + <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> + </div> + <div id="log"></div> + </body> +</html>
\ No newline at end of file diff --git a/dom/events/test/pointerevents/readme.md b/dom/events/test/pointerevents/readme.md new file mode 100644 index 000000000..f0d4fc73e --- /dev/null +++ b/dom/events/test/pointerevents/readme.md @@ -0,0 +1,5 @@ +Directory for Pointer Events Tests + +All tests were got from official repository: + +https://github.com/w3c/web-platform-tests/tree/master/pointerevents diff --git a/dom/events/test/pointerevents/resources/pointerevent_pointerId_scope-iframe.html b/dom/events/test/pointerevents/resources/pointerevent_pointerId_scope-iframe.html new file mode 100644 index 000000000..ad1a57fb4 --- /dev/null +++ b/dom/events/test/pointerevents/resources/pointerevent_pointerId_scope-iframe.html @@ -0,0 +1,37 @@ +<!doctype html> +<html> + <!-- +Test cases for Pointer Events v1 spec +This document references Test Assertions (abbrev TA below) written by Cathy Chan +http://www.w3.org/wiki/PointerEvents/TestAssertions +--> + <head> + <title>Pointer Events pointerdown tests</title> + <meta name="viewport" content="width=device-width"> + <link rel="stylesheet" type="text/css" href="../pointerevent_styles.css"> + <script> + function run() { + var target1 = document.getElementById("target1"); + var pointerover_event; + var ponterId = null; + + var eventList = ['pointerenter', 'pointerover', 'pointermove', 'pointerout', 'pointerleave']; + + eventList.forEach(function(eventName) { + target1.addEventListener(eventName, function (event) { + var pass_data = { + 'pointerId' : event.pointerId, + 'type' : event.type, + 'pointerType' : event.pointerType + }; + top.postMessage(JSON.stringify(pass_data), "*"); + }); + }); + } + </script> + </head> + <body onload="run()"> + <div id="target1" class="touchActionNone"> + </div> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_bug1285128.html b/dom/events/test/pointerevents/test_bug1285128.html new file mode 100644 index 000000000..f7f1eb698 --- /dev/null +++ b/dom/events/test/pointerevents/test_bug1285128.html @@ -0,0 +1,48 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1285128 +--> +<head> + <meta charset="utf-8"> + <title>Test for Bug 1285128</title> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> +</head> +<body> +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1285128">Mozilla Bug 1285128</a> +<p id="display"></p> +<div id="target0" style="width: 200px; height: 200px; background: green"></div> +<script type="text/javascript"> + +/** Test for Bug 1285128 **/ +SimpleTest.waitForExplicitFinish(); + +function runTests() { + let target0 = window.document.getElementById("target0"); + let pointerEventsList = ["pointerover", "pointerenter", "pointerdown", + "pointerup", "pointerleave", "pointerout"]; + let receivedPointerEvents = false; + pointerEventsList.forEach((elem, index, arr) => { + target0.addEventListener(elem, (event) => { + ok(false, "receiving event " + event.type); + receivedPointerEvents = true; + }, false); + }); + + target0.addEventListener("mouseenter", () => { + ok(!receivedPointerEvents, "synthesized mousemove should not trigger any pointer events"); + SimpleTest.finish(); + }); + + synthesizeMouseAtCenter(target0, { type: "mousemove", + inputSource: SpecialPowers.Ci.nsIDOMMouseEvent.MOZ_SOURCE_MOUSE, + isWidgetEventSynthesized: true }); +} + +SpecialPowers.pushPrefEnv({"set": [["dom.w3c_pointer_events.enabled", true]]}, runTests); + +</script> +</body> +</html> diff --git a/dom/events/test/pointerevents/test_bug1293174_implicit_pointer_capture_for_touch_1.html b/dom/events/test/pointerevents/test_bug1293174_implicit_pointer_capture_for_touch_1.html new file mode 100644 index 000000000..bf5fd5d5e --- /dev/null +++ b/dom/events/test/pointerevents/test_bug1293174_implicit_pointer_capture_for_touch_1.html @@ -0,0 +1,30 @@ +<!DOCTYPE HTML> +<html> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1293174</title> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + setImplicitPointerCapture(true, loadSubFrame); + } + function loadSubFrame() { + runTestInNewWindow("bug1293174_implicit_pointer_capture_for_touch_1.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchmove"); + sendTouchEvent(int_win, "target1", "touchmove"); + sendTouchEvent(int_win, "target0", "touchmove"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> + diff --git a/dom/events/test/pointerevents/test_bug1293174_implicit_pointer_capture_for_touch_2.html b/dom/events/test/pointerevents/test_bug1293174_implicit_pointer_capture_for_touch_2.html new file mode 100644 index 000000000..f1a1cc314 --- /dev/null +++ b/dom/events/test/pointerevents/test_bug1293174_implicit_pointer_capture_for_touch_2.html @@ -0,0 +1,30 @@ +<!DOCTYPE HTML> +<html> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1293174</title> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + setImplicitPointerCapture(false, loadSubFrame); + } + function loadSubFrame() { + runTestInNewWindow("bug1293174_implicit_pointer_capture_for_touch_2.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchmove"); + sendTouchEvent(int_win, "target1", "touchmove"); + sendTouchEvent(int_win, "target0", "touchmove"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> + diff --git a/dom/events/test/pointerevents/test_empty_file.html b/dom/events/test/pointerevents/test_empty_file.html new file mode 100644 index 000000000..56f2cd085 --- /dev/null +++ b/dom/events/test/pointerevents/test_empty_file.html @@ -0,0 +1,7 @@ +<!DOCTYPE HTML> +<html> +<!-- +This file should exist until bug 1150091 will be fixed. +[manifestparser] Adding support-files under tests overwrites DEFAULT instead of appending. +--> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_attributes_mouse-manual.html b/dom/events/test/pointerevents/test_pointerevent_attributes_mouse-manual.html new file mode 100644 index 000000000..1cda30c35 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_attributes_mouse-manual.html @@ -0,0 +1,33 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_attributes_mouse-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "square1", "mousemove", {button:-1}); + sendMouseEvent(int_win, "square1", "mousedown", {button:0}); + sendMouseEvent(int_win, "square1", "mouseup", {button:0}); + sendMouseEvent(int_win, "square1", "mousemove", {button:-1}); + sendMouseEvent(int_win, "square1", "mousemove", {button:-1, + offsetX: -1, + offsetY: -1}); + } + </script> + </head> + <body> + </body> +</html> + diff --git a/dom/events/test/pointerevents/test_pointerevent_capture_mouse-manual.html b/dom/events/test/pointerevents/test_pointerevent_capture_mouse-manual.html new file mode 100644 index 000000000..d2e0c52bf --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_capture_mouse-manual.html @@ -0,0 +1,32 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_capture_mouse-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "btnCapture", "mousemove"); + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "btnCapture", "mousedown", {button:1}); + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "target1", "mouseup"); + sendMouseEvent(int_win, "target1", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_capture_suppressing_mouse-manual.html b/dom/events/test/pointerevents/test_pointerevent_capture_suppressing_mouse-manual.html new file mode 100644 index 000000000..dc3903592 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_capture_suppressing_mouse-manual.html @@ -0,0 +1,33 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_capture_suppressing_mouse-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "btnCapture", "mousedown", {button:1}); + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "target1", "mouseup"); + sendMouseEvent(int_win, "target1", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_change-touch-action-onpointerdown_touch-manual.html b/dom/events/test/pointerevents/test_pointerevent_change-touch-action-onpointerdown_touch-manual.html new file mode 100644 index 000000000..44d4f2a1b --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_change-touch-action-onpointerdown_touch-manual.html @@ -0,0 +1,39 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_change-touch-action-onpointerdown_touch-manual.html"); + } + function executeTest(int_win) { + const WM_VSCROLL = 0x0115; + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchmove"); + sendTouchEvent(int_win, "target0", "touchend"); + + // NOTE: This testcase is about that modifying touch-action during a + // pointerdown callback "should not" affect the gesture detection of the + // touch session started by the pointerdown. That is, a scroll should + // still fired by gesture detection, instead of launching by our own. + var utils = _getDOMWindowUtils(int_win); + var target0 = int_win.document.getElementById("target0"); + utils.sendNativeMouseScrollEvent(target0.getBoundingClientRect().left + 5, + target0.getBoundingClientRect().top + 5, + WM_VSCROLL, 10, 10, 0, 0, 0, target0); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_constructor.html b/dom/events/test/pointerevents/test_pointerevent_constructor.html new file mode 100644 index 000000000..785169fb5 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_constructor.html @@ -0,0 +1,26 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_constructor.html"); + } + function executeTest(int_win) { + // Function should be, but can be empty + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_element_haspointercapture-manual.html b/dom/events/test/pointerevents/test_pointerevent_element_haspointercapture-manual.html new file mode 100644 index 000000000..215e93b57 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_element_haspointercapture-manual.html @@ -0,0 +1,32 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_element_haspointercapture-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target1", "mousemove", {button:0}); + sendMouseEvent(int_win, "target1", "mouseup", {button:0}); + sendMouseEvent(int_win, "target1", "mousedown", {button:0}); + sendMouseEvent(int_win, "target1", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_element_haspointercapture_release_pending_capture-manual.html b/dom/events/test/pointerevents/test_pointerevent_element_haspointercapture_release_pending_capture-manual.html new file mode 100644 index 000000000..1ec769bc7 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_element_haspointercapture_release_pending_capture-manual.html @@ -0,0 +1,30 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_element_haspointercapture_release_pending_capture-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target1", "mousemove", {button:0}); + sendMouseEvent(int_win, "target1", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_gotpointercapture_before_first_pointerevent-manual.html b/dom/events/test/pointerevents/test_pointerevent_gotpointercapture_before_first_pointerevent-manual.html new file mode 100644 index 000000000..875e18429 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_gotpointercapture_before_first_pointerevent-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_gotpointercapture_before_first_pointerevent-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_lostpointercapture_for_disconnected_node-manual.html b/dom/events/test/pointerevents/test_pointerevent_lostpointercapture_for_disconnected_node-manual.html new file mode 100644 index 000000000..b381de108 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_lostpointercapture_for_disconnected_node-manual.html @@ -0,0 +1,31 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + SimpleTest.requestFlakyTimeout("Official test uses timeout"); + function startTest() { + runTestInNewWindow("pointerevent_lostpointercapture_for_disconnected_node-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "btnCapture", "mousedown"); + sendMouseEvent(int_win, "btnCapture", "mousemove"); + setTimeout(function() { + sendMouseEvent(int_win, "target1", "mousemove"); + }, 500); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_lostpointercapture_is_first-manual.html b/dom/events/test/pointerevents/test_pointerevent_lostpointercapture_is_first-manual.html new file mode 100644 index 000000000..43071b67f --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_lostpointercapture_is_first-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_lostpointercapture_is_first-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "btnCapture", "mousedown", {button:0}); + sendMouseEvent(int_win, "btnCapture", "mouseup", {button:0}); + sendMouseEvent(int_win, "btnCapture", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_multiple_primary_pointers_boundary_events-manual.html b/dom/events/test/pointerevents/test_pointerevent_multiple_primary_pointers_boundary_events-manual.html new file mode 100644 index 000000000..d3c2f8962 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_multiple_primary_pointers_boundary_events-manual.html @@ -0,0 +1,31 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_multiple_primary_pointers_boundary_events-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendTouchEvent(int_win, "target1", "touchstart"); + sendTouchEvent(int_win, "target1", "touchend"); + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "done", "mousedown", {button:0}); + sendMouseEvent(int_win, "done", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerId_scope-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerId_scope-manual.html new file mode 100644 index 000000000..d78246dca --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerId_scope-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerId_scope-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointercancel_touch-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointercancel_touch-manual.html new file mode 100644 index 000000000..de2839350 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointercancel_touch-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointercancel_touch-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchcancel"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerdown-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerdown-manual.html new file mode 100644 index 000000000..f6febcfd4 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerdown-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerdown-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "log", "mousemove"); + sendMouseEvent(int_win, "target0", "mousedown", {button:1}); + sendMouseEvent(int_win, "target0", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerenter-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerenter-manual.html new file mode 100644 index 000000000..9c2247198 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerenter-manual.html @@ -0,0 +1,26 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerenter-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerenter_does_not_bubble-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerenter_does_not_bubble-manual.html new file mode 100644 index 000000000..5e13dd212 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerenter_does_not_bubble-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerenter_does_not_bubble-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "log", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerenter_nohover-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerenter_nohover-manual.html new file mode 100644 index 000000000..b92db3d52 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerenter_nohover-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerenter_nohover-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "log", "mousemove"); + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_after_pointercancel_touch-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_after_pointercancel_touch-manual.html new file mode 100644 index 000000000..89419e29b --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_after_pointercancel_touch-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_after_pointercancel_touch-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchcancel"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_after_pointerup_nohover-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_after_pointerup_nohover-manual.html new file mode 100644 index 000000000..1cde764c4 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_after_pointerup_nohover-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_after_pointerup_nohover-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_descendant_over-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_descendant_over-manual.html new file mode 100644 index 000000000..49c769f40 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_descendant_over-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_descendant_over-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target1", "mousedown"); + sendMouseEvent(int_win, "target1", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_descendants-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_descendants-manual.html new file mode 100644 index 000000000..6893b4aca --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_descendants-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_descendants-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "log", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_does_not_bubble-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_does_not_bubble-manual.html new file mode 100644 index 000000000..e7b96d218 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_does_not_bubble-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_does_not_bubble-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_mouse-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_mouse-manual.html new file mode 100644 index 000000000..d15f2c72a --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_mouse-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_mouse-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "log", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_pen-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_pen-manual.html new file mode 100644 index 000000000..52f8d6618 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_pen-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_pen-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + sendMouseEvent(int_win, "target0", "mouseup", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + sendMouseEvent(int_win, "target0", "mousecancel", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerleave_touch-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerleave_touch-manual.html new file mode 100644 index 000000000..78ad0190a --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerleave_touch-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerleave_touch-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointermove-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointermove-manual.html new file mode 100644 index 000000000..218da5124 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointermove-manual.html @@ -0,0 +1,26 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointermove-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointermove-on-chorded-mouse-button.html b/dom/events/test/pointerevents/test_pointerevent_pointermove-on-chorded-mouse-button.html new file mode 100644 index 000000000..6e90b4230 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointermove-on-chorded-mouse-button.html @@ -0,0 +1,37 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointermove-on-chorded-mouse-button.html"); + } + + function executeTest(int_win) { + var utils = _getDOMWindowUtils(int_win); + sendMouseEvent(int_win, "target0", "mousemove", {button:0, buttons:utils.MOUSE_BUTTONS_NO_BUTTON}); + sendMouseEvent(int_win, "target0", "mousedown", {button:0, buttons:utils.MOUSE_BUTTONS_LEFT_BUTTON}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0, buttons:utils.MOUSE_BUTTONS_LEFT_BUTTON}); + sendMouseEvent(int_win, "target0", "mousedown", {button:1, buttons:utils.MOUSE_BUTTONS_LEFT_BUTTON | + utils.MOUSE_BUTTONS_MIDDLE_BUTTON}); + sendMouseEvent(int_win, "target0", "mousemove", {button:1, buttons:utils.MOUSE_BUTTONS_LEFT_BUTTON | + utils.MOUSE_BUTTONS_MIDDLE_BUTTON}); + sendMouseEvent(int_win, "target0", "mouseup", {button:1, buttons:utils.MOUSE_BUTTONS_LEFT_BUTTON}); + sendMouseEvent(int_win, "target0", "mousemove", {button:1, buttons:utils.MOUSE_BUTTONS_LEFT_BUTTON}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0, buttons:utils.MOUSE_BUTTONS_NO_BUTTON}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html new file mode 100644 index 000000000..a0f3cee07 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointermove_isprimary_same_as_pointerdown-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown"); + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target0", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointermove_pointertype-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointermove_pointertype-manual.html new file mode 100644 index 000000000..7b2d13980 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointermove_pointertype-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointermove_pointertype-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown"); + sendMouseEvent(int_win, "target0", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerout-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerout-manual.html new file mode 100644 index 000000000..31c6dad5f --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerout-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerout-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerout_after_pointercancel_touch-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerout_after_pointercancel_touch-manual.html new file mode 100644 index 000000000..c861caf26 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerout_after_pointercancel_touch-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerout_after_pointercancel_touch-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchcancel"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerout_after_pointerup_nohover-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerout_after_pointerup_nohover-manual.html new file mode 100644 index 000000000..c3bfd29d5 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerout_after_pointerup_nohover-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerout_after_pointerup_nohover-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerout_pen-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerout_pen-manual.html new file mode 100644 index 000000000..11f48b104 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerout_pen-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerout_pen-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + sendMouseEvent(int_win, "target0", "mouseup", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + sendMouseEvent(int_win, "target0", "mousecancel", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerout_received_once-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerout_received_once-manual.html new file mode 100644 index 000000000..b895244bb --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerout_received_once-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerout_received_once-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerover-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerover-manual.html new file mode 100644 index 000000000..80ae99c48 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerover-manual.html @@ -0,0 +1,26 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerover-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointertype_mouse-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointertype_mouse-manual.html new file mode 100644 index 000000000..aec2e8486 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointertype_mouse-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointertype_mouse-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointertype_pen-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointertype_pen-manual.html new file mode 100644 index 000000000..1469de68c --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointertype_pen-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointertype_pen-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + sendMouseEvent(int_win, "target0", "mouseup", {inputSource:MouseEvent.MOZ_SOURCE_PEN}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointertype_touch-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointertype_touch-manual.html new file mode 100644 index 000000000..18a99f490 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointertype_touch-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointertype_touch-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerup-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerup-manual.html new file mode 100644 index 000000000..5417ad5cd --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerup-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerup-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown"); + sendMouseEvent(int_win, "target0", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html new file mode 100644 index 000000000..fc1fb6981 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerup_isprimary_same_as_pointerdown-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_pointerup_pointertype-manual.html b/dom/events/test/pointerevents/test_pointerevent_pointerup_pointertype-manual.html new file mode 100644 index 000000000..b6f07dd50 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_pointerup_pointertype-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_pointerup_pointertype-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown"); + sendMouseEvent(int_win, "target0", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_events_to_original_target-manual.html b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_events_to_original_target-manual.html new file mode 100644 index 000000000..cbf91df74 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_events_to_original_target-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_releasepointercapture_events_to_original_target-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchmove"); + sendTouchEvent(int_win, "target0", "touchend"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_invalid_pointerid-manual.html b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_invalid_pointerid-manual.html new file mode 100644 index 000000000..55f347358 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_invalid_pointerid-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_releasepointercapture_invalid_pointerid-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchmove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_onpointercancel_touch-manual.html b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_onpointercancel_touch-manual.html new file mode 100644 index 000000000..6b63c307c --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_onpointercancel_touch-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_releasepointercapture_onpointercancel_touch-manual.html"); + } + function executeTest(int_win) { + sendTouchEvent(int_win, "target0", "touchstart"); + sendTouchEvent(int_win, "target0", "touchcancel"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_onpointerup_mouse-manual.html b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_onpointerup_mouse-manual.html new file mode 100644 index 000000000..8d5bec3c3 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_onpointerup_mouse-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_releasepointercapture_onpointerup_mouse-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "btnCapture", "mousedown"); + sendMouseEvent(int_win, "btnCapture", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_release_right_after_capture-manual.html b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_release_right_after_capture-manual.html new file mode 100644 index 000000000..3f55c1afe --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_releasepointercapture_release_right_after_capture-manual.html @@ -0,0 +1,30 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_releasepointercapture_release_right_after_capture-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_setpointercapture_disconnected-manual.html b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_disconnected-manual.html new file mode 100644 index 000000000..ffbfc6009 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_disconnected-manual.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_setpointercapture_disconnected-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown"); + sendMouseEvent(int_win, "target0", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_setpointercapture_inactive_button_mouse-manual.html b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_inactive_button_mouse-manual.html new file mode 100644 index 000000000..e587e6e68 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_inactive_button_mouse-manual.html @@ -0,0 +1,28 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_setpointercapture_inactive_button_mouse-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target1", "mousemove"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_setpointercapture_invalid_pointerid-manual.html b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_invalid_pointerid-manual.html new file mode 100644 index 000000000..61171196a --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_invalid_pointerid-manual.html @@ -0,0 +1,26 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_setpointercapture_invalid_pointerid-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_setpointercapture_override_pending_capture_element-manual.html b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_override_pending_capture_element-manual.html new file mode 100644 index 000000000..5a3adede6 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_override_pending_capture_element-manual.html @@ -0,0 +1,31 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_setpointercapture_override_pending_capture_element-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_setpointercapture_relatedtarget-manual.html b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_relatedtarget-manual.html new file mode 100644 index 000000000..0883d616b --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_relatedtarget-manual.html @@ -0,0 +1,29 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_setpointercapture_relatedtarget-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "btnCapture", "mousedown"); + sendMouseEvent(int_win, "target1", "mousemove"); + sendMouseEvent(int_win, "target1", "mouseup"); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_setpointercapture_to_same_element_twice-manual.html b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_to_same_element_twice-manual.html new file mode 100644 index 000000000..e4af7dd56 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_setpointercapture_to_same_element_twice-manual.html @@ -0,0 +1,31 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_setpointercapture_to_same_element_twice-manual.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousemove"); + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_suppress_compat_events_on_click.html b/dom/events/test/pointerevents/test_pointerevent_suppress_compat_events_on_click.html new file mode 100644 index 000000000..c09135449 --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_suppress_compat_events_on_click.html @@ -0,0 +1,31 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_suppress_compat_events_on_click.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + sendMouseEvent(int_win, "target1", "mousedown", {button:0}); + sendMouseEvent(int_win, "target1", "mouseup", {button:0}); + sendMouseEvent(int_win, "done", "mousedown", {button:0}); + sendMouseEvent(int_win, "done", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_pointerevent_suppress_compat_events_on_drag_mouse.html b/dom/events/test/pointerevents/test_pointerevent_suppress_compat_events_on_drag_mouse.html new file mode 100644 index 000000000..d379134cd --- /dev/null +++ b/dom/events/test/pointerevents/test_pointerevent_suppress_compat_events_on_drag_mouse.html @@ -0,0 +1,33 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1000870 +--> + <head> + <meta charset="utf-8"> + <title>Test for Bug 1000870</title> + <meta name="author" content="Maksim Lebedev" /> + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <script type="text/javascript" src="mochitest_support_external.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="text/javascript"> + SimpleTest.waitForExplicitFinish(); + function startTest() { + runTestInNewWindow("pointerevent_suppress_compat_events_on_drag_mouse.html"); + } + function executeTest(int_win) { + sendMouseEvent(int_win, "target0", "mousedown", {button:0}); + sendMouseEvent(int_win, "target0", "mousemove", {button:0}); + sendMouseEvent(int_win, "target0", "mouseup", {button:0}); + sendMouseEvent(int_win, "target1", "mousedown", {button:0}); + sendMouseEvent(int_win, "target1", "mousemove", {button:0}); + sendMouseEvent(int_win, "target1", "mouseup", {button:0}); + sendMouseEvent(int_win, "done", "mousedown", {button:0}); + sendMouseEvent(int_win, "done", "mouseup", {button:0}); + } + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/test_touch_action.html b/dom/events/test/pointerevents/test_touch_action.html new file mode 100644 index 000000000..31d115f82 --- /dev/null +++ b/dom/events/test/pointerevents/test_touch_action.html @@ -0,0 +1,99 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <title>W3C pointerevents/*touch-action*.html tests in Mochitest form</title> + <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="application/javascript" src="apz_test_utils.js"></script> + <script type="application/javascript" src="apz_test_native_event_utils.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> + <script type="application/javascript"> +var apz_touch_action_prefs = [ + // Obviously we need touch-action support enabled for testing touch-action. + ["layout.css.touch_action.enabled", true], + // Dropping the touch slop to 0 makes the tests easier to write because + // we can just do a one-pixel drag to get over the pan threshold rather + // than having to hard-code some larger value. + ["apz.touch_start_tolerance", "0.0"], + // The touchstart from the drag can turn into a long-tap if the touch-move + // events get held up. Try to prevent that by making long-taps require + // a 10 second hold. Note that we also cannot enable chaos mode on this + // test for this reason, since chaos mode can cause the long-press timer + // to fire sooner than the pref dictates. + ["ui.click_hold_context_menus.delay", 10000], + // The subtests in this test do touch-drags to pan the page, but we don't + // want those pans to turn into fling animations, so we increase the + // fling-stop threshold velocity to absurdly high. + ["apz.fling_stopped_threshold", "10000"], + // The helper_div_pan's div gets a displayport on scroll, but if the + // test takes too long the displayport can expire before the new scroll + // position is synced back to the main thread. So we disable displayport + // expiry for these tests. + ["apz.displayport_expiry_ms", 0], +]; + +function apzScriptInjector(name) { + return function(childWin) { + childWin._ACTIVE_TEST_NAME = name; + injectScript('/tests/SimpleTest/paint_listener.js', childWin)() + .then(injectScript('apz_test_utils.js', childWin)) + .then(injectScript('apz_test_native_event_utils.js', childWin)) + .then(injectScript('touch_action_helpers.js', childWin)); + }; +} + +// Each of these test names is turned into an entry in the |subtests| array +// below. +var testnames = [ + 'pointerevent_touch-action-auto-css_touch-manual', + 'pointerevent_touch-action-button-test_touch-manual', + // this one runs as a web-platform-test since it's not a manual test + // 'pointerevent_touch-action-illegal', + 'pointerevent_touch-action-inherit_child-auto-child-none_touch-manual', + 'pointerevent_touch-action-inherit_child-none_touch-manual', + 'pointerevent_touch-action-inherit_child-pan-x-child-pan-x_touch-manual', + 'pointerevent_touch-action-inherit_child-pan-x-child-pan-y_touch-manual', + 'pointerevent_touch-action-inherit_highest-parent-none_touch-manual', + 'pointerevent_touch-action-inherit_parent-none_touch-manual', + // the keyboard-manual and mouse-manual tests require simulating keyboard/ + // mouse input, rather than touch, so we're not going to do that here. + //'pointerevent_touch-action-keyboard-manual', + //'pointerevent_touch-action-mouse-manual', + 'pointerevent_touch-action-none-css_touch-manual', + 'pointerevent_touch-action-pan-x-css_touch-manual', + 'pointerevent_touch-action-pan-x-pan-y-pan-y_touch-manual', + 'pointerevent_touch-action-pan-x-pan-y_touch-manual', + 'pointerevent_touch-action-pan-y-css_touch-manual', + 'pointerevent_touch-action-span-test_touch-manual', + 'pointerevent_touch-action-svg-test_touch-manual', + 'pointerevent_touch-action-table-test_touch-manual', + // this one runs as a web-platform-test since it's not a manual test + //'pointerevent_touch-action-verification', +]; + +// Each entry in |subtests| is loaded in a new window. When loaded, it runs +// the function returned by apzScriptInjector, which injects some helper JS +// files into the vanilla unmodified W3C testcase, and simulates the necessary +// user input to run the test. +var subtests = []; +for (var name of testnames) { + subtests.push({ + 'file': name + '.html', + 'prefs': apz_touch_action_prefs, + 'onload': apzScriptInjector(name), + }); +} + +if (isApzEnabled()) { + SimpleTest.waitForExplicitFinish(); + window.onload = function() { + runSubtestsSeriallyInFreshWindows(subtests) + .then(SimpleTest.finish); + }; +} + + </script> + </head> + <body> + </body> +</html> diff --git a/dom/events/test/pointerevents/touch_action_helpers.js b/dom/events/test/pointerevents/touch_action_helpers.js new file mode 100644 index 000000000..91f628827 --- /dev/null +++ b/dom/events/test/pointerevents/touch_action_helpers.js @@ -0,0 +1,206 @@ +// Some common helpers + +function touchActionSetup(testDriver) { + add_completion_callback(subtestDone); + document.body.addEventListener('touchend', testDriver, { passive: true }); +} + +function touchScrollRight(aSelector = '#target0', aX = 20, aY = 20) { + var target = document.querySelector(aSelector); + return ok(synthesizeNativeTouchDrag(target, aX + 40, aY, -40, 0), "Synthesized horizontal drag"); +} + +function touchScrollDown(aSelector = '#target0', aX = 20, aY = 20) { + var target = document.querySelector(aSelector); + return ok(synthesizeNativeTouchDrag(target, aX, aY + 40, 0, -40), "Synthesized vertical drag"); +} + +function tapComplete() { + var button = document.getElementById('btnComplete'); + return button.click(); +} + +// The main body functions to simulate the input events required for the named test + +function* pointerevent_touch_action_auto_css_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollDown(); +} + +function* pointerevent_touch_action_button_test_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollDown('#target0 > button'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0 > button'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_inherit_child_auto_child_none_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_inherit_child_none_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown('#target0 > div'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0 > div'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_inherit_child_pan_x_child_pan_x_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_inherit_child_pan_x_child_pan_y_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_inherit_highest_parent_none_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown('#target0 > div'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0 > div'); +} + +function* pointerevent_touch_action_inherit_parent_none_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_none_css_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_pan_x_css_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_pan_x_pan_y_pan_y_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0 > div div'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_pan_x_pan_y_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight(); +} + +function* pointerevent_touch_action_pan_y_css_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_span_test_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollDown('#testspan'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#testspan'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_svg_test_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown(); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollRight(); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollDown('#target0', 250, 250); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#target0', 250, 250); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +function* pointerevent_touch_action_table_test_touch_manual(testDriver) { + touchActionSetup(testDriver); + + yield touchScrollDown('#row1'); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollRight('#row1'); + yield waitForApzFlushedRepaints(testDriver); + yield setTimeout(testDriver, 2 * scrollReturnInterval); + yield touchScrollDown('#cell3'); + yield waitForApzFlushedRepaints(testDriver); + yield touchScrollRight('#cell3'); + yield waitForApzFlushedRepaints(testDriver); + yield tapComplete(); +} + +// This the stuff that runs the appropriate body function above + +var test = eval(_ACTIVE_TEST_NAME.replace(/-/g, '_')); +waitUntilApzStable().then(runContinuation(test)); |