pageswap-traverse-navigation-no-bfcache.https.html (2718B)
1 <!DOCTYPE html> 2 <title>View transitions: pageswap navigationactivation for traverse navigations</title> 3 <link rel="help" href="https://drafts.csswg.org/css-view-transitions-2/"> 4 <link rel="author" href="mailto:khushalsagar@chromium.org"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="resources/common.js"></script> 8 <style></style> 9 <script> 10 const channel = new BroadcastChannel("testchannel"); 11 12 const params = new URLSearchParams(location.search); 13 const is_initial_page_first_navigation = params.has('popup') && navigation.entries().length == 1; 14 const is_new_page = params.has('new'); 15 const is_test_page = !params.has('popup') && !params.has('new'); 16 17 function enableViewTransition() { 18 document.styleSheets[0].insertRule(` 19 @view-transition { 20 navigation: auto; 21 } 22 `); 23 } 24 25 if (is_new_page) 26 enableViewTransition(); 27 28 // The test page which opens a popup for the navigation sequence. 29 if (is_test_page) { 30 const expectedUrl = location.href.split('?')[0] + "?popup"; 31 const expectedEvents = ["pageswap", "transition", expectedUrl, "traverse","from", "pagehide"]; 32 33 promise_test(async t => { 34 let popup; 35 onload = () => { 36 window.events = []; 37 popup = window.open("?popup"); 38 t.add_cleanup(() => popup.close()); 39 }; 40 41 await new Promise(resolve => { 42 channel.addEventListener( 43 "message", t.step_func(async (e) => { 44 if (e.data === "nav") { 45 assert_array_equals(window.events, expectedEvents, 'incorrect event order'); 46 popup.close(); 47 resolve(); 48 } 49 })); 50 }); 51 }, `pageswap on traverse navigation from script`); 52 } else if (is_initial_page_first_navigation) { 53 // The popup page which the user navigates back to. 54 onload = async () => { 55 await disableBFCache(); 56 requestAnimationFrame(() => requestAnimationFrame(() => { 57 location.href = location.href.split('?')[0] + '?new'; 58 })); 59 }; 60 61 onpageshow = (e) => { 62 assert_false(e.persisted, 'the test should run without BFCache'); 63 } 64 } else if (is_new_page) { 65 onload = () => { 66 requestAnimationFrame(() => requestAnimationFrame(() => { 67 navigation.back(); 68 })); 69 }; 70 71 onpageswap = (e) => { 72 window.opener.events.push("pageswap"); 73 if (e.viewTransition != null) 74 window.opener.events.push("transition"); 75 window.opener.events.push(e.activation.entry.url); 76 window.opener.events.push(e.activation.navigationType); 77 if (e.activation.from == navigation.currentEntry) 78 window.opener.events.push("from"); 79 }; 80 81 onpagehide = () => { 82 window.opener.events.push("pagehide"); 83 channel.postMessage("nav"); 84 }; 85 } 86 </script>