scroll-to-text-fragment-same-doc.html (1919B)
1 <!doctype html> 2 <title>Navigating to a same-document text fragment directive</title> 3 <meta charset=utf-8> 4 <link rel="help" href="https://wicg.github.io/ScrollToTextFragment/"> 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-vendor.js"></script> 9 <script> 10 function isInView(element) { 11 let rect = element.getBoundingClientRect(); 12 return rect.top >= 0 && rect.top <= window.innerHeight; 13 } 14 15 function checkScroll(resolve) { 16 let position = 'unknown'; 17 requestAnimationFrame(() => { 18 if (window.scrollY == 0) 19 position = 'top'; 20 else if (isInView(document.getElementById('text'))) 21 position = 'text'; 22 resolve(position); 23 }); 24 } 25 26 function reset() { 27 window.location.hash = ""; 28 window.scrollTo(0, 0); 29 } 30 31 function runTest() { 32 promise_test(t => new Promise(resolve => { 33 reset(); 34 window.location.href = "#:~:text=test"; 35 requestAnimationFrame(function() { 36 checkScroll(resolve); 37 }); 38 }).then(position => { 39 assert_equals(position, 'text'); 40 assert_equals(window.location.href.indexOf(':~:'), -1, 'Expected fragment directive to be stripped from the URL.'); 41 }), 'Activated for same-document window.location setter'); 42 43 promise_test(t => new Promise(resolve => { 44 reset(); 45 window.location.replace("#:~:text=test"); 46 requestAnimationFrame(function() { 47 checkScroll(resolve); 48 }); 49 }).then(position => { 50 assert_equals(position, 'text'); 51 assert_equals(window.location.href.indexOf(':~:'), -1, 'Expected fragment directive to be stripped from the URL.'); 52 }), 'Activated for same-document window.location.replace'); 53 } 54 </script> 55 <style> 56 body { 57 height: 3200px; 58 } 59 #text { 60 position: absolute; 61 top: 3000px; 62 } 63 </style> 64 <body onload="runTest()"> 65 <p id="text">This is a test page</p> 66 </body>