diff options
Diffstat (limited to 'dom/events/test/pointerevents/pointerevent_attributes_mouse-manual.html')
| -rw-r--r-- | dom/events/test/pointerevents/pointerevent_attributes_mouse-manual.html | 113 |
1 files changed, 113 insertions, 0 deletions
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> + |