beforematch-scroll-to-text-fragment-basic.html (2196B)
1 <!DOCTYPE html> 2 <script src="/scroll-to-text-fragment/stash.js"></script> 3 4 <!-- This test is navigated to with the fragment #:~:text=foo --> 5 6 <div style="height: 4000px;">spacer</div> 7 8 <script> 9 (async () => { 10 const results = {}; 11 const key = (new URLSearchParams(window.location.search)).get('key'); 12 13 // This test adds the elements from JS 14 // (unlike beforematch-scroll-to-text-fragment-with-anchor.html, 15 // which uses parser-created elements) 16 const foo = document.createElement('div'); 17 foo.hidden = 'until-found'; 18 foo.textContent = 'foo'; 19 document.body.appendChild(foo); 20 21 let beforematchResolver = null; 22 const beforematchPromise = new Promise(resolve => { 23 beforematchResolver = resolve; 24 }); 25 26 // This should be true. Foo was searched for, so it should get a 27 // beforematch event. 28 results.beforematchFiredOnFoo = false; 29 // This should be true. the hidden attribute should not be removed until 30 // after beforematch is fired. 31 results.beforematchHiddenAttributePresent = false; 32 foo.addEventListener('beforematch', () => { 33 results.beforematchFiredOnFoo = true; 34 results.beforematchHiddenAttributePresent = foo.hasAttribute('hidden'); 35 // This should be zero. Scrolling should happen after beforematch is 36 // fired. 37 results.pageYOffsetDuringBeforematch = window.pageYOffset; 38 beforematchResolver(); 39 }); 40 41 const bar = document.createElement('div'); 42 bar.hidden = 'until-found'; 43 bar.textContent = 'bar'; 44 document.body.appendChild(bar); 45 // This should be false. Bar was not searched for, so it should not get 46 // a beforematch event. 47 results.beforematchFiredOnBar = false; 48 bar.addEventListener('beforematch', () => { 49 // this handler should never run. If it does, 50 // send back the message immediately to make the test fail. 51 results.beforematchFiredOnBar = true; 52 stashResultsThenClose(key, results); 53 }); 54 55 await beforematchPromise; 56 await new Promise(requestAnimationFrame); 57 await new Promise(requestAnimationFrame); 58 // This should be greater than zero. The page should be scrolled down 59 // to foo. 60 results.pageYOffsetAfterRaf = window.pageYOffset; 61 stashResultsThenClose(key, results); 62 })(); 63 </script>