root-scroll-button-activation.html (1247B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Overflow: ::scroll-button on root element activation</title> 4 <link rel="help" href="https://drafts.csswg.org/css-overflow-5/#scroll-buttons"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="/resources/testdriver.js"></script> 8 <script src="/resources/testdriver-actions.js"></script> 9 <script src="/resources/testdriver-vendor.js"></script> 10 <script src="/web-animations/testcommon.js"></script> 11 <script src="/dom/events/scrolling/scroll_support.js"></script> 12 <style> 13 body { 14 margin: 0; 15 } 16 17 :root::scroll-button(block-end) { 18 content: "down"; 19 position: absolute; 20 top: 0; 21 width: 30px; 22 height: 30px;; 23 } 24 25 div { 26 width: 600px; 27 height: 300px; 28 margin-bottom: 20px; 29 background: green; 30 } 31 </style> 32 <div></div> 33 <div></div> 34 <div></div> 35 <script> 36 promise_test(async t => { 37 let scrollEndPromise = waitForScrollEndFallbackToDelayWithoutScrollEvent(window); 38 await new test_driver.Actions() 39 .pointerMove(10, 10) 40 .pointerDown() 41 .pointerUp() 42 .send(); 43 await scrollEndPromise; 44 await waitForAnimationFrames(2); 45 assert_not_equals(window.scrollY, 0); 46 }); 47 </script>