beforematch-scroll-to-text-fragment.html (3722B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <meta name=timeout content=long> 4 <title>beforematch fired on ScrollToTextFragment</title> 5 <link rel="author" title="Joey Arhar" href="mailto:jarhar@chromium.org"> 6 <link rel="help" href="https://html.spec.whatwg.org/multipage/interaction.html#the-hidden-attribute:event-beforematch"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <script src="/resources/testdriver.js"></script> 10 <script src="/resources/testdriver-vendor.js"></script> 11 12 <script src="/common/utils.js"></script> 13 <script src="/scroll-to-text-fragment/stash.js"></script> 14 15 <script> 16 async function fetchResultsNoResolver(key) { 17 return new Promise((resolve, reject) => { 18 fetchResults(key, resolve, reject); 19 }); 20 } 21 22 promise_test(async () => { 23 const key = token(); 24 await test_driver.bless('Open a scroll to text fragment URL'); 25 window.open( 26 `resources/beforematch-scroll-to-text-fragment-basic.html?key=${key}#:~:text=foo`, 27 '_blank', 28 'noopener'); 29 const results = await fetchResultsNoResolver(key); 30 assert_true(results.beforematchFiredOnFoo, 31 'Foo was searched for, so it should get a beforematch event.'); 32 assert_false(results.beforematchFiredOnBar, 33 'Bar was not searched for, so it should not get a beforematch event.'); 34 assert_equals(results.pageYOffsetDuringBeforematch, 0, 35 'Scrolling should happen after beforematch is fired.'); 36 assert_true(results.pageYOffsetAfterRaf > 0, 37 'The page should be scrolled down to foo.'); 38 assert_true(results.beforematchHiddenAttributePresent, 39 'The hidden attribute should be set inside the beforematch event handler.'); 40 }, 'Verifies that the beforematch event is fired on the matching element of a ScrollToTextFragment navigation.'); 41 42 promise_test(async () => { 43 const key = token(); 44 await test_driver.bless('Open a scroll to text fragment URL'); 45 window.open( 46 `resources/beforematch-scroll-to-text-fragment-with-anchor.html?key=${key}#bar:~:text=foo`, 47 '_blank', 48 'noopener'); 49 const results = await fetchResultsNoResolver(key); 50 assert_true(results.fooHasHiddenAttribute, 51 'hidden=until-found revealing should not happen until after the script tag loads.'); 52 assert_true(results.beforematchFiredOnFoo, 53 'foo was searched for, so it should get the beforematch event.'); 54 assert_false(results.beforematchFiredOnBar, 55 'bar should not get the beforematch event despite being the target of an element fragment due to the text fragment.'); 56 assert_equals(results.pageYOffsetDuringBeforematch, 0, 57 'Scrolling should happen after beforematch is fired.'); 58 assert_true(results.pageYOffsetAfterRaf > 0, 59 'The page should be scrolled down to foo.'); 60 }, 'Verifies that beforematch is only fired on elements targeted by a text fragment when there is both a text fragment and an element fragment.'); 61 62 promise_test(async () => { 63 const key = token(); 64 await test_driver.bless('Open a scroll to text fragment URL'); 65 window.open( 66 `resources/beforematch-scroll-to-text-fragment-bubble.html?key=${key}#:~:text=foo`, 67 '_blank', 68 'noopener'); 69 const results = await fetchResultsNoResolver(key); 70 assert_true(results.beforematchFiredOnChild, 71 'The element containing the searched text should have beforematch fired on it.'); 72 assert_true(results.beforematchFiredOnParent, 73 'The parent element of the element containing the matching text should have the beforematch event fired on it because the event should bubble.'); 74 }, 'Verifies that the beforematch event bubbles with scroll to text fragment.'); 75 76 // TODO(jarhar): Write more tests here once we decide on a behavior here: https://github.com/WICG/display-locking/issues/150 77 </script>