helper_hittest_fixed-2.html (1995B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>APZ hit-testing of fixed content when async-scrolled</title> 5 <script type="application/javascript" src="apz_test_utils.js"></script> 6 <script type="application/javascript" src="apz_test_native_event_utils.js"></script> 7 <script src="/tests/SimpleTest/paint_listener.js"></script> 8 <meta name="viewport" content="width=device-width"/> 9 <style> 10 html, body { 11 margin: 0; 12 } 13 #fixed { 14 position: fixed; 15 height: 300px; 16 width: 100%; 17 top: 0; 18 background: blue; 19 } 20 #target { 21 margin-top: 100px; 22 margin-left: 100px; 23 height: 20px; 24 width: 20px; 25 background: red; 26 } 27 </style> 28 </head> 29 <body> 30 <div id="fixed"> 31 <div id="target"></div> 32 </div> 33 <div id="make_root_scrollable" style="height: 5000px"></div> 34 </body> 35 <script type="application/javascript"> 36 37 async function test() { 38 // Async scroll the page by 50 pixels using the mouse-wheel. 39 await promiseMoveMouseAndScrollWheelOver(document.body, 10, 10, 40 /* waitForScroll = */ false, /* scrollDelta = */ 50); 41 42 let clickPromise = new Promise(resolve => { 43 target.addEventListener("click", e => { 44 ok(true, "Target was hit"); 45 e.stopPropagation(); // do not propagate event to |fixed| ancestor 46 resolve(); 47 }); 48 fixed.addEventListener("click", () => { 49 // Since target's listener calls stopPropagation(), if we get here 50 // then the coordinates of the click event did not correspond to 51 // |target|, but somewhere else on |fixed|. 52 ok(false, "Fixed ancestor should not be hit"); 53 resolve(); 54 }); 55 }); 56 57 // Synthesize a click at (110, 110), which should hit |target| (a 58 // descendant of |fixed|) regardless of the async scroll. 59 await synthesizeNativeMouseEventWithAPZ({ 60 type: "click", 61 target: window, 62 offsetX: 110, 63 offsetY: 110 64 }); 65 66 await clickPromise; 67 } 68 69 waitUntilApzStable() 70 .then(test) 71 .then(subtestDone, subtestFailed); 72 73 </script> 74 </html>