scroll-initial-target-with-anchor-navigation.tentative.html (2594B)
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="utf-8"> 6 <title> CSS Scroll Snap 2 Test: scroll-initial-target interaction with anchor navigation</title> 7 <link rel="help" href="https://drafts.csswg.org/css-scroll-snap-2/#scroll-initial-target"> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <script src="/resources/testdriver.js"></script> 11 <script src="/resources/testdriver-actions.js"></script> 12 <script src="/resources/testdriver-vendor.js"></script> 13 <script src="/html/browsers/browsing-the-web/resources/helpers.js"></script> 14 <script src="/dom/events/scrolling/scroll_support.js"></script> 15 </head> 16 17 <body> 18 <iframe id="frame" src="scroll-initial-target-with-anchor-navigation-inner-frame.html" onload="runTest()"></iframe> 19 <script> 20 function runTest() { 21 promise_test(async (t) => { 22 await waitForCompositorCommit(); 23 let scroller = frame.contentDocument.scrollingElement; 24 // anchor_target is at the bottom of the frame so the frame should be 25 // fully scrolled down to bring it into view. 26 let anchor_target_scrolltop = scroller.scrollHeight - scroller.clientHeight; 27 let anchor_target_link = frame.contentDocument.getElementById("anchor_target_link"); 28 29 // Expect scroll offset of 100px per scroll-start. 30 const scroll_start_target_top = 0.6 * frame.contentWindow.innerHeight; 31 assert_equals(scroller.scrollTop, scroll_start_target_top, 32 "scroll-initial-target sets initial scroll offset"); 33 34 // Scroll away from start position. 35 scroller.scrollTop = 200; 36 assert_equals(scroller.scrollTop, 200, 37 "scrolled away from scroll-initial-target"); 38 39 anchor_target_link.click(); 40 await waitForHashchange(frame.contentWindow); 41 assert_equals(frame.contentWindow.location.hash, "#anchor_target", 42 "clicking anchor link navigates to target"); 43 44 // Expect page to be fully scrolled as anchor_target is at the bottom of 45 // the document. 46 assert_equals(scroller.scrollTop, anchor_target_scrolltop, 47 "anchor navigation sets scroll offset"); 48 49 frame.contentWindow.history.back(); 50 await waitForHashchange(frame.contentWindow); 51 assert_equals(frame.contentWindow.location.hash, ""); 52 53 assert_equals(scroller.scrollTop, 200, 54 "scroller returns to previous scroll position, not " + 55 "scroll-initial-target"); 56 }, "scroll-initial-target does not override anchor navigation."); 57 } 58 </script> 59 </body>