pointer-events-none-skip-scroll-in-iframe.html (1646B)
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 } 27 .spacer { 28 height: 200vh; 29 } 30 </style> 31 <div id="scroller"> 32 <div class="spacer"></div> 33 </div> 34 <div class="spacer"></div> 35 `; 36 }); 37 let scrolled = new Promise((resolve) => { 38 let scrollers = [ 39 window, 40 iframe.contentWindow, 41 iframe.contentDocument.getElementById("scroller") 42 ]; 43 let onscroll = (evt) => { 44 for (const scroller of scrollers) { 45 scroller.removeEventListener("scroll", onscroll); 46 } 47 resolve(evt.target.id || "root"); 48 } 49 for (const scroller of scrollers) { 50 scroller.addEventListener("scroll", onscroll); 51 } 52 }); 53 const actions = new test_driver.Actions().scroll(50, 50, 0, 50, { duration: 50 }); 54 actions.send(); 55 assert_equals(await scrolled, "root", "Incorrect element scrolled"); 56 }, "Wheel-scroll over pointer-events: none scroller skips that scroller"); 57 </script>