OLD | NEW |
1 <!doctype html> | 1 <!doctype html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <title>Lostpointercapture triggers first and asynchronously</title> | 4 <title>Lostpointercapture triggers first and asynchronously</title> |
5 <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 ca
pture was released. This event is fired at the element from which pointer captur
e was removed;"> | 5 <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 ca
pture was released. This event is fired at the element from which pointer captur
e was removed;"> |
6 <meta name="viewport" content="width=device-width"> | 6 <meta name="viewport" content="width=device-width"> |
7 <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> | 7 <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> |
8 <script src="/resources/testharness.js"></script> | 8 <script src="/resources/testharness.js"></script> |
9 <script src="/resources/testharnessreport.js"></script> | 9 <script src="/resources/testharnessreport.js"></script> |
10 <script src="pointerevent_support.js"></script> | 10 <script src="pointerevent_support.js"></script> |
11 </head> | 11 </head> |
12 <body onload="run()"> | 12 <body onload="run()"> |
13 <h1>Pointer Events capture test - lostpointercapture order</h1> | 13 <h1>Pointer Events capture test - lostpointercapture order</h1> |
14 <h4> | 14 <h4> |
15 Test Description: | 15 Test Description: |
16 This test checks if lostpointercapture is handled asynchronously and
prior to all subsequent events. | 16 This test checks if lostpointercapture is handled asynchronously and
prior to all subsequent events. |
17 Complete the following actions: | 17 Complete the following actions: |
18 <ol> | 18 <ol> |
19 <li>Press and hold left mouse button over "Set Capture" button.
"gotpointercapture" should be logged inside of the black rectangle | 19 <li>Press and hold left mouse button over "Set Capture" button a
nd move a little. "gotpointercapture" should be logged inside of the black recta
ngle |
20 <li>"lostpointercapture" should be logged inside of the black re
ctangle after pointerup | 20 <li>"lostpointercapture" should be logged inside of the black re
ctangle after pointerup |
21 </ol> | 21 </ol> |
22 </h4> | 22 </h4> |
23 Test passes if lostpointercapture is dispatched after releasing the mous
e button and before any additional pointer events. | 23 Test passes if lostpointercapture is dispatched after releasing the mous
e button and before any additional pointer events. |
24 <div id="target0" style="background:black; color:white"></div> | 24 <div id="target0" style="background:black; color:white"></div> |
25 <br> | 25 <br> |
26 <input type="button" id="btnCapture" value="Set Capture"> | 26 <input type="button" id="btnCapture" value="Set Capture"> |
27 <script type='text/javascript'> | 27 <script type='text/javascript'> |
28 var detected_pointertypes = {}; | 28 var detected_pointertypes = {}; |
29 var detected_pointerEvents = new Array(); | 29 var detected_pointerEvents = new Array(); |
30 var pointerdown_event = null; | 30 var pointerdown_event = null; |
| 31 var firstPointermoveReceived = false; // To handle the first pointer
move right after gotpointercapture which gotpointercapture was sent right before
it. |
| 32 var firstPointeroverReceived = false; // To handle the first pointer
over right after gotpointercapture which gotpointercapture was sent right before
it. |
| 33 var firstPointerenterReceived = false; // To handle the first pointe
enter right after gotpointercapture which gotpointercapture was sent right befor
e it. |
31 | 34 |
32 var test_pointerEvent = async_test("lostpointercapture is dispatched
prior to subsequent events"); // set up test harness | 35 var test_pointerEvent = async_test("lostpointercapture is dispatched
prior to subsequent events"); // set up test harness |
33 | 36 |
34 var isPointerCapture = false; | 37 var isPointerCapture = false; |
35 var count=0; | 38 var count=0; |
36 | 39 |
37 var testStarted = false; | 40 var testStarted = false; |
38 var eventRcvd = false; | 41 var eventRcvd = false; |
39 var isAsync = false; | 42 var isAsync = false; |
40 | 43 |
(...skipping 49 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
90 eventsRcvd_str += detected_pointerEvents[i]
+ ", "; | 93 eventsRcvd_str += detected_pointerEvents[i]
+ ", "; |
91 } | 94 } |
92 } | 95 } |
93 test_pointerEvent.step(function () { | 96 test_pointerEvent.step(function () { |
94 assert_false(eventRcvd, "no other events should
be received before lostpointercapture." + eventsRcvd_str); | 97 assert_false(eventRcvd, "no other events should
be received before lostpointercapture." + eventsRcvd_str); |
95 assert_equals(event.pointerId, pointerdown_event
.pointerId, "pointerID is same for pointerdown and lostpointercapture"); | 98 assert_equals(event.pointerId, pointerdown_event
.pointerId, "pointerID is same for pointerdown and lostpointercapture"); |
96 }); | 99 }); |
97 test_pointerEvent.done(); // complete test | 100 test_pointerEvent.done(); // complete test |
98 } | 101 } |
99 else { | 102 else { |
100 if (testStarted && pointerdown_event != null && poin
terdown_event.pointerId === event.pointerId && event.type != "pointerup") { | 103 if (testStarted && pointerdown_event != null && poin
terdown_event.pointerId === event.pointerId) { |
101 detected_pointerEvents.push(event.type); | 104 if (event.type == "pointermove" && !firstPointer
moveReceived) { |
102 eventRcvd = true; | 105 firstPointermoveReceived = true; |
| 106 } |
| 107 else if (event.type == "pointerenter" && !firstP
ointerenterReceived) { |
| 108 firstPointerenterReceived = true; |
| 109 } |
| 110 else if (event.type == "pointerover" && !firstPo
interoverReceived) { |
| 111 firstPointeroverReceived = true; |
| 112 } |
| 113 else if (event.type != "pointerup") { |
| 114 detected_pointerEvents.push(event.type); |
| 115 eventRcvd = true; |
| 116 } |
103 } | 117 } |
104 } | 118 } |
105 }); | 119 }); |
106 } | 120 } |
107 } | 121 } |
108 </script> | 122 </script> |
109 <h1>Pointer Events Capture Test</h1> | 123 <h1>Pointer Events Capture Test</h1> |
110 <div id="complete-notice"> | 124 <div id="complete-notice"> |
111 <p>The following pointer types were detected: <span id="pointertype-
log"></span>.</p> | 125 <p>The following pointer types were detected: <span id="pointertype-
log"></span>.</p> |
112 </div> | 126 </div> |
113 <div id="log"></div> | 127 <div id="log"></div> |
114 </body> | 128 </body> |
115 </html> | 129 </html> |
OLD | NEW |