navigation-api-precommit-handler.html (1932B)
1 <!DOCTYPE html> 2 <meta charset="utf-8" /> 3 <script src="/resources/testharness.js"></script> 4 <script src="/resources/testharnessreport.js"></script> 5 <script src="/resources/testdriver.js"></script> 6 <script src="/resources/testdriver-vendor.js"></script> 7 <script src="/soft-navigation-heuristics/resources/soft-navigation-test-helper.js"></script> 8 9 <a href="/forward/" id="navigateLink">Click here!</button> 10 <h1>Heading!</h1> 11 <div id="content"></div> 12 13 <script> 14 window.onload = () => { 15 if (test_driver) { 16 test_driver.click(navigateLink); 17 } 18 }; 19 20 window.navigation.addEventListener('navigate', e => { 21 e.intercept({ 22 async precommitHandler(controller) { 23 // Defer resolving the precommit promise to ensure the navigation is 24 // tracked from the link click through to commit, across tasks. 25 await scheduler.postTask(() => {}, {delay: 20}); 26 }, 27 28 async handler() { 29 const url = new URL(e.destination.url); 30 if (url.pathname == '/forward/') { 31 // Update the DOM in a separate task to ensure the soft navigation 32 // state continues to be propagated from the commit. 33 await scheduler.yield(); 34 content.innerHTML = "<div>The Page Has Navigated</div>"; 35 } 36 } 37 }); 38 }); 39 40 promise_test(async t => { 41 const softNavPromise = 42 SoftNavigationTestHelper.getPerformanceEntries("soft-navigation"); 43 const helper = new SoftNavigationTestHelper(t); 44 const softNavs = await helper.withTimeoutMessage( 45 softNavPromise, "Soft navigation not detected.", /*timeout=*/ 3000); 46 assert_equals(softNavs.length, 1, 'Expected exactly one soft navigation.'); 47 assert_true( 48 softNavs[0].name.endsWith('/forward/'), 49 `Unexpected Soft Navigation URL. Expected URL to end with "/forward/" but got ${softNavs[0].name}`); 50 }, 'Soft Navigation Detection supports navigation API precommit handlers'); 51 </script>