pointer-events-none-skip-scroll-will-change-in-iframe.html (1680B)
1 <!doctype html> 2 <meta charset=utf-8> 3 <title>pointer-events: none correctly targets scrolls</title> 4 <script src=/resources/testharness.js></script> 5 <script src=/resources/testharnessreport.js></script> 6 <script src="/resources/testdriver.js"></script> 7 <script src="/resources/testdriver-vendor.js"></script> 8 <script src="/resources/testdriver-actions.js"></script> 9 10 <div style="pointer-events: none"> 11 <iframe id="iframe"></iframe> 12 </div> 13 <div style="height: 200vh"></div> 14 15 <script> 16 promise_test(async (t) => { 17 let iframe = document.getElementById("iframe"); 18 await new Promise((resolve) => { 19 iframe.onload = resolve; 20 iframe.srcdoc = ` 21 <style> 22 #scroller { 23 overflow: auto; 24 height: 100px; 25 border: 2px solid blue; 26 will-change: scroll-position; 27 } 28 .spacer { 29 height: 200vh; 30 } 31 </style> 32 <div id="scroller"> 33 <div class="spacer"></div> 34 </div> 35 <div class="spacer"></div> 36 `; 37 }); 38 let scrolled = new Promise((resolve) => { 39 let scrollers = [ 40 window, 41 iframe.contentWindow, 42 iframe.contentDocument.getElementById("scroller") 43 ]; 44 let onscroll = (evt) => { 45 for (const scroller of scrollers) { 46 scroller.removeEventListener("scroll", onscroll); 47 } 48 resolve(evt.target.id || "root"); 49 } 50 for (const scroller of scrollers) { 51 scroller.addEventListener("scroll", onscroll); 52 } 53 }); 54 const actions = new test_driver.Actions().scroll(50, 50, 0, 50, { duration: 50 }); 55 actions.send(); 56 assert_equals(await scrolled, "root", "Incorrect element scrolled"); 57 }, "Wheel-scroll over pointer-events: none scroller skips that scroller"); 58 </script>