wheel-event-no-scroll-after-prevent-default.html (2257B)
1 <!DOCTYPE html> 2 3 <head> 4 <meta charset="utf-8"> 5 <title>Ensure that the calling `preventDefault` on a wheel event prevents a scroll from happening</title> 6 <link rel="author" title="Martin Robinson" href="mailto:mrobinson@igalia.com"> 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 </head> 13 14 <body> 15 <div id="scroller" style="width: 100px; height: 100px; overflow: scroll; position: relative;"> 16 <div style="position: absolute; width: 100px; height: 500px; background: red;"></div> 17 <div style="position: absolute; width: 100px; height: 100px; background: green;"></div> 18 </div> 19 20 <script> 21 function waitForFrame() { 22 return new Promise(resolve => { 23 window.requestAnimationFrame(resolve); 24 }); 25 } 26 27 function runTest() { 28 promise_test(async(t) => { 29 let wheelEventFired = false; 30 let scrollEventFired = false; 31 scroller.addEventListener("wheel", (event) => { 32 wheelEventFired = true; 33 event.preventDefault() 34 }); 35 scroller.addEventListener("scroll", (event) => { 36 scrollEventFired = true; 37 event.preventDefault() 38 }); 39 40 await new test_driver.Actions() 41 .addWheel("wheel1") 42 .scroll(50, 50, 0, 30, {origin: "viewport"}) 43 .pause(1) 44 .scroll(50, 50, 0, 30, {origin: "viewport"}) 45 .pause(1) 46 .scroll(50, 50, 0, 30, {origin: "viewport"}) 47 .send(); 48 49 await waitForFrame(); 50 await waitForFrame(); 51 await waitForFrame(); 52 await waitForFrame(); 53 54 assert_true(wheelEventFired); 55 assert_false(scrollEventFired); 56 }, "When `preventDefault` is called on a WheelEvent, scrolling should be prevented."); 57 } 58 window.onload = runTest; 59 </script> 60 </body>