test_pointerrawupdate_event_count.html (5688B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Test for number of pointerrawupdate events</title> 7 <script src="/tests/SimpleTest/EventUtils.js"></script> 8 <script src="/tests/SimpleTest/SimpleTest.js"></script> 9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 10 </head> 11 <body> 12 <div id="target0" style="width: 50px; height: 50px; background: green"></div> 13 <script> 14 SimpleTest.waitForExplicitFinish(); 15 SimpleTest.requestCompleteLog(); 16 SimpleTest.waitForFocus(async () => { 17 await SpecialPowers.pushPrefEnv({"set": [ 18 ["dom.event.pointer.rawupdate.enabled", true], 19 ["dom.event.pointer.rawupdate.movement.enabled", true], 20 ["dom.events.coalesce.mousemove", true], 21 ]}); 22 23 const target0 = window.document.getElementById("target0"); 24 25 // First for flushing pending events in the main process, we should synthesize 26 // a simple click and wait for that. 27 info("Waiting for a click for waiting for stable state..."); 28 await new Promise(resolve => { 29 target0.addEventListener("click", resolve, {once: true}); 30 synthesizeMouseAtCenter(target0, { asyncEnabled: true }); 31 }); 32 info("Got a click which must be synthesized by us!"); 33 34 const utils = SpecialPowers.getDOMWindowUtils(window); 35 utils.advanceTimeAndRefresh(0); 36 await new Promise(resolve => SimpleTest.executeSoon(resolve)); 37 38 function stringifyPointerEvent(event) { 39 return `{ screenX: ${event.screenX}, screenY: ${ 40 event.screenY 41 }, clientX: ${event.clientX}, clientY:${event.clientY}, button:${ 42 event.button 43 }, buttons:${event.buttons} }`; 44 } 45 46 const allEvents = []; 47 const pointerRawUpdateEvents = []; 48 function onPointerRawUpdate(event) { 49 allEvents.push(event); 50 pointerRawUpdateEvents.push(event); 51 // Currently, we need to compute the coordinates of the coalesced events 52 // while the host event is being dispatched. See bug 1960530. 53 event.getCoalescedEvents(); 54 if (pointerRawUpdateEvents.length == 4) { 55 utils.restoreNormalRefresh(); 56 } 57 } 58 target0.addEventListener("pointerrawupdate", onPointerRawUpdate); 59 60 const coalescedPointerMoveEvents = []; 61 const waitForPointerMove = new Promise(function (resolve) { 62 function onPointerMove(event) { 63 allEvents.push(event); 64 for (const coalescedEvent of event.getCoalescedEvents()) { 65 coalescedPointerMoveEvents.push(coalescedEvent); 66 } 67 if (coalescedPointerMoveEvents.length == 4) { 68 target0.removeEventListener("pointermove", onPointerMove); 69 target0.removeEventListener("pointerrawupdate", onPointerRawUpdate); 70 resolve(); 71 } 72 }; 73 target0.addEventListener("pointermove", onPointerMove); 74 }); 75 76 info("Synthesizing mouse moves...."); 77 synthesizeMouse(target0, 5, 5, { type: "mousemove", asyncEnabled: true }); 78 synthesizeMouse(target0, 10, 10, { type: "mousemove", asyncEnabled: true }); 79 synthesizeMouse(target0, 15, 15, { type: "mousemove", asyncEnabled: true }); 80 synthesizeMouse(target0, 20, 20, { type: "mousemove", asyncEnabled: true }); 81 info("Waiting for 4 coalesced pointermove events..."); 82 await waitForPointerMove; 83 84 for (const event of allEvents) { 85 info(`${event.type}: ${stringifyPointerEvent(event)}`); 86 } 87 for (const event of coalescedPointerMoveEvents) { 88 info(`Coalesced ${event.type}: ${stringifyPointerEvent(event)}`); 89 } 90 91 ok(!!pointerRawUpdateEvents.length, "At least one pointerrawupdate event should be fired"); 92 is( 93 pointerRawUpdateEvents.length, 94 coalescedPointerMoveEvents.length, 95 `pointermove.getCoalescedEvents().length should be same as the number of preceding pointerrawupdate` 96 ); 97 { 98 let i = 0; 99 for (const pointerRawUpdateEvent of pointerRawUpdateEvents) { 100 const coalescedEvents = pointerRawUpdateEvent.getCoalescedEvents(); 101 is( 102 coalescedEvents.length, 103 1, 104 `pointerrawupdate(${i}): should have only one coalesced event` 105 ); 106 is( 107 `${coalescedEvents[0].type}: ${stringifyPointerEvent(coalescedEvents[0])}`, 108 `${pointerRawUpdateEvent.type}: ${stringifyPointerEvent(pointerRawUpdateEvent)}`, 109 `pointerrawupdate(${i++}): the coalesced event should have same values as the host event` 110 ); 111 } 112 } 113 for (let i = 0; i < Math.min(pointerRawUpdateEvents.length, coalescedPointerMoveEvents.length); i++) { 114 is( 115 stringifyPointerEvent(pointerRawUpdateEvents[i]), 116 stringifyPointerEvent(coalescedPointerMoveEvents[i]), 117 `pointerrawupdate(${i++}): should have same values as coalesced pointermove events` 118 ); 119 } 120 { 121 const lastPoint = {x: pointerRawUpdateEvents[0].screenX, y: pointerRawUpdateEvents[0].screenY}; 122 for (let i = 1; i < pointerRawUpdateEvents.length; i++) { 123 const event = pointerRawUpdateEvents[i]; 124 isfuzzy( 125 event.movementX, 126 event.screenX - lastPoint.x, 127 1, 128 `pointerrawupdate[${i}].movementX (screenX: ${event.screenX}, lastPoint.x: ${lastPoint.x})` 129 ); 130 isfuzzy( 131 event.movementY, 132 event.screenY - lastPoint.y, 133 1, 134 `pointerrawupdate[${i}].movementY (screenY: ${event.screenY}, lastPoint.y: ${lastPoint.y})` 135 ); 136 lastPoint.x = event.screenX; 137 lastPoint.y = event.screenY; 138 } 139 } 140 141 info("Waiting for a click for waiting for stable state after the test..."); 142 await new Promise(resolve => { 143 target0.addEventListener("click", resolve, {once: true}); 144 synthesizeMouseAtCenter(target0, { asyncEnabled: true }); 145 }); 146 info("Got a click after the test!"); 147 utils.restoreNormalRefresh(); 148 SimpleTest.finish(); 149 }); 150 </script> 151 </body> 152 </html>