pointerevent_boundary_events_before_pointerrawupdate.https.html (2418B)
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale:1"> 6 <title>Pointer boundary events should be fired before `pointerrawupdate`</title> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <script src="/resources/testdriver.js"></script> 10 <script src="/resources/testdriver-actions.js"></script> 11 <script src="/resources/testdriver-vendor.js"></script> 12 <script> 13 "use strict"; 14 15 /** 16 * "fire a pointer event" defines as: 17 * > Before firing this event, the user agent SHOULD treat the target as if the 18 * > pointing device has moved over it from the previousTarget for the purpose 19 * > of ensuring event ordering [UIEVENTS]. If the needsOverEvent flag is set, 20 * > a pointerover event is needed even if the target element is the same. 21 * 22 * Thus, pointer boundary events should be fired before `pointerrawupdate` 23 * event if they are required. This test checks that. 24 */ 25 26 addEventListener("DOMContentLoaded", () => { 27 promise_test(async () => { 28 let events = []; 29 function logEvent(event) { 30 events.push(event.type); 31 } 32 const initialDiv = document.getElementById("init"); 33 await new test_driver.Actions() 34 .pointerMove(0, 0, {origin: initialDiv}) 35 .send(); 36 const target = document.getElementById("target"); 37 for (const type of ["pointerrawupdate", "pointermove", 38 "pointerenter", "pointerover", 39 "pointerleave", "pointerout", 40 "mouseover", "mouseenter"]) { 41 target.addEventListener(type, logEvent); 42 } 43 // Neither "mouseover" nor "mouseenter" should be fired before 44 // "pointerrawupdate", they should be fired after "pointerrawupdate" 45 // at least. 46 target.addEventListener("pointerrawupdate", () => { 47 for (const type of ["mouseover", "mouseenter"]) { 48 target.removeEventListener(type, logEvent); 49 } 50 }, {once: true}); 51 await new test_driver.Actions() 52 .pointerMove(0, 0, {origin: target}) 53 .send(); 54 assert_equals( 55 events.join(", "), 56 [ 57 "pointerover", 58 "pointerenter", 59 "pointerrawupdate", 60 "pointermove", 61 ].join(", ") 62 ); 63 }); 64 }, {once: true}); 65 </script> 66 <style> 67 div { 68 width: 64px; 69 height: 64px; 70 } 71 </style> 72 <body> 73 <div id="init"></div> 74 <div id="target"></div> 75 </body> 76 </html>