helper_bug1502010_unconsumed_pan.html (2818B)
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 pointercancel doesn't get sent for horizontal panning on a pan-y element</title> 7 <script src="/tests/SimpleTest/paint_listener.js"></script> 8 <script type="application/javascript" src="apz_test_utils.js"></script> 9 <script type="application/javascript" src="apz_test_native_event_utils.js"></script> 10 <script type="application/javascript"> 11 var pointerMoveCount = 0; 12 var lastPointerCoord = -1; 13 var apzFlushed = false; 14 var endEventReceived = false; 15 var testEndResolveFunc = null; 16 var testEndPromise = new Promise(resolve => { 17 testEndResolveFunc = resolve; 18 }); 19 20 function checkForTestEnd() { 21 if (apzFlushed && endEventReceived) { 22 var target = document.getElementById("carousel"); 23 target.removeEventListener("pointermove", moveListener); 24 25 ok(pointerMoveCount > 0, "Got " + pointerMoveCount + " pointermove events"); 26 is(document.scrollingElement.scrollTop, 0, "Document didn't y-scroll"); 27 is(document.scrollingElement.scrollLeft, 0, "Document didn't x-scroll"); 28 29 testEndResolveFunc(); 30 } 31 } 32 33 function moveListener(event) { 34 ok(event.clientX >= lastPointerCoord, "Got nondecreasing pointermove to " + event.clientX + "," + event.clientY); 35 lastPointerCoord = event.clientX; 36 pointerMoveCount++; 37 } 38 39 async function test() { 40 var target = document.getElementById("carousel"); 41 target.addEventListener("pointercancel", () => { 42 ok(false, "Received pointercancel, uh-oh!"); 43 endEventReceived = true; 44 setTimeout(checkForTestEnd, 0); 45 }, {once: true}); 46 target.addEventListener("pointerup", () => { 47 ok(true, "Received pointerup"); 48 endEventReceived = true; 49 setTimeout(checkForTestEnd, 0); 50 }, {once: true}); 51 52 target.addEventListener("pointermove", moveListener); 53 54 // Drag mostly horizontally but also slightly vertically. If the 55 // touch-action were not respected due to a bug this might result 56 // in vertical scrolling instead of pointermove events. 57 await new Promise(resolve => { 58 synthesizeNativeTouchDrag(target, 10, 10, 200, -10, resolve); 59 }); 60 await promiseOnlyApzControllerFlushed(); 61 apzFlushed = true; 62 63 setTimeout(checkForTestEnd, 0); 64 65 await testEndPromise; 66 } 67 68 waitUntilApzStable().then(test).then(subtestDone, subtestFailed); 69 70 </script> 71 </head> 72 <body> 73 <div id="carousel" style="height: 50px; touch-action: pan-y; background-color: blue"></div> 74 <div id="spacer" style="height: 2000px"></div> 75 </body> 76 </html>