scroll-marker-inert-002.html (1441B)
1 <!DOCTYPE html> 2 <title>CSS Overflow Test: Originating element inertness not applied to ::scroll-marker</title> 3 <link rel="help" href="https://drafts.csswg.org/css-overflow-5/#scroll-markers"> 4 <link rel="help" href="https://drafts.csswg.org/css-ui/#inertness"> 5 <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11746"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <script src="/resources/testdriver.js"></script> 9 <script src="/resources/testdriver-actions.js"></script> 10 <script src="/resources/testdriver-vendor.js"></script> 11 <style> 12 body { margin: 0; } 13 #scroller { 14 width: 100px; 15 height: 100px; 16 overflow-y: scroll; 17 scroll-marker-group: before; 18 } 19 #scroller::scroll-marker-group { 20 height: 100px; 21 } 22 .item { 23 height: 100px; 24 background-color: lime; 25 interactivity: inert; 26 } 27 .item::scroll-marker { 28 content: "X"; 29 display: block; 30 width: 20px; 31 height: 20px; 32 } 33 #filler { 34 height: 400px; 35 } 36 </style> 37 <div id="scroller"> 38 <div class="item"></div> 39 <div id="filler"></div> 40 <div id="target" class="item"></div> 41 </div> 42 <script> 43 promise_test(async t => { 44 await new test_driver.Actions() 45 .pointerMove(10, 30) 46 .pointerDown() 47 .pointerUp() 48 .send(); 49 assert_equals(scroller.scrollTop, 500); 50 }, "::scroll-marker is not inert because its ::scroll-marker-group isn't"); 51 </script>