| OLD | NEW |
| (Empty) | |
| 1 <!doctype html> |
| 2 <html> |
| 3 <head> |
| 4 <title>Pointer Events properties tests</title> |
| 5 <meta name="viewport" content="width=device-width"> |
| 6 <link rel="stylesheet" type="text/css" href="../pointerevent_styles.css"
> |
| 7 <script src="/resources/testharness.js"></script> |
| 8 <script src="/resources/testharnessreport.js"></script> |
| 9 <!-- Additional helper script for common checks across event types --> |
| 10 <script type="text/javascript" src="../pointerevent_support.js"></script
> |
| 11 <style> |
| 12 #testContainer { |
| 13 touch-action: none; |
| 14 user-select: none; |
| 15 position: relative; |
| 16 } |
| 17 #box1 { |
| 18 top: 30px; |
| 19 left: 50px; |
| 20 background: black; |
| 21 } |
| 22 #box2 { |
| 23 top: 70px; |
| 24 left: 250px; |
| 25 background: red; |
| 26 } |
| 27 #innerFrame { |
| 28 top: 10px; |
| 29 left: 100px; |
| 30 } |
| 31 #square2 { |
| 32 visibility: block; |
| 33 } |
| 34 </style> |
| 35 <script> |
| 36 var expectedPointerId = NaN; |
| 37 var startSummation = false; |
| 38 var lastScreenX = 0; |
| 39 var lastScreenY = 0; |
| 40 |
| 41 function resetTestState() { |
| 42 startSummation = false; |
| 43 lastScreenX = 0; |
| 44 lastScreenY = 0; |
| 45 } |
| 46 |
| 47 function run() { |
| 48 var test_pointerEvent = setup_pointerevent_test("pointerevent at
tributes", ['mouse', 'touch']); |
| 49 |
| 50 [document, document.getElementById('innerFrame').contentDocument
].forEach(function(element) { |
| 51 on_event(element, 'pointermove', function (event) { |
| 52 if (startSummation) { |
| 53 test_pointerEvent.step(function() { |
| 54 assert_equals(event.movementX, event.screenX - lastScree
nX, "movementX should be the delta between current event's and last event's scre
enX"); |
| 55 assert_equals(event.movementY, event.screenY - lastScree
nY, "movementY should be the delta between current event's and last event's scre
enY"); |
| 56 }); |
| 57 lastScreenX = event.screenX; |
| 58 lastScreenY = event.screenY; |
| 59 } |
| 60 }); |
| 61 }); |
| 62 on_event(document.querySelector('#box1'), 'pointerdown', functio
n(event) { |
| 63 event.target.releasePointerCapture(event.pointerId); |
| 64 test_pointerEvent.step(function() { |
| 65 assert_equals(event.pointerType, expectedPointerType, "Use
the instructed pointer type."); |
| 66 }); |
| 67 startSummation = true; |
| 68 lastScreenX = event.screenX; |
| 69 lastScreenY = event.screenY; |
| 70 }); |
| 71 on_event(document.querySelector('#box2'), 'pointerup', function(
event) { |
| 72 startSummation = false; |
| 73 test_pointerEvent.done(); |
| 74 }); |
| 75 } |
| 76 </script> |
| 77 </head> |
| 78 <body onload="run()"> |
| 79 <h1>Pointer Events movementX/Y attribute test</h1> |
| 80 <h2 id="pointerTypeDescription"></h2> |
| 81 <h4> |
| 82 Test Description: This test checks the properties of pointer events
that do not support hover. |
| 83 <ol> |
| 84 <li>Press down on the black square.</li> |
| 85 <li>Move your pointer slowly along a straight line to the red
square.</li> |
| 86 <li>Release the pointer when you are over the red square.</li> |
| 87 </ol> |
| 88 |
| 89 Test passes if the proper behavior of the events is observed. |
| 90 </h4> |
| 91 <div id="testContainer"> |
| 92 <div id="box1" class="square"></div> |
| 93 <div id="box2" class="square"></div> |
| 94 <iframe id="innerFrame" src="resources/pointerevent_movementxy-ifram
e.html"></iframe> |
| 95 </div> |
| 96 <div class="spacer"></div> |
| 97 </body> |
| 98 </html> |
| 99 |
| OLD | NEW |