distant-leaf-text.window.js (1746B)
1 // META: script=/resources/testdriver.js 2 // META: script=/resources/testdriver-vendor.js 3 // META: script=../../resources/soft-navigation-test-helper.js 4 5 // This test is very similar to distant-leaf-text.window.js, but the leaf 6 // node is text instead of an image. 7 // 8 // This test is intended to verify that when a distant leaf of a 9 // deeply nested div element is attached to the DOM, its painting can 10 // trigger a soft navigation. 11 // 12 // To show this, we create a button that, when clicked, creates a deeply 13 // nested div element and attaches it to the DOM - only the leaf, a text 14 // node saying "Hello, World.", 10 levels below the attachment point actually 15 // gets painted. 16 17 function clickHandler() { 18 let div = document.createElement('div'); 19 div.textContent = 'Hello, World.'; // The leaf node that gets painted. 20 for (let i = 0; i < 10; i++) { 21 const tmp = document.createElement('div'); 22 tmp.appendChild(div); 23 div = tmp; 24 } 25 document.body.appendChild(div); 26 history.pushState({}, '', '/greeting'); 27 } 28 29 const button = document.createElement('div'); 30 button.textContent = 'Click here!'; 31 button.onclick = clickHandler; 32 document.body.appendChild(button); 33 34 promise_test(async (t) => { 35 if (test_driver) { 36 test_driver.click(button); 37 } 38 const helper = new SoftNavigationTestHelper(t); 39 const entries = await helper.getBufferedPerformanceEntriesWithTimeout( 40 /*type=*/ 'soft-navigation', 41 /*minNumEntries=*/ 1, 42 /*timeout=*/ 3000 43 ); 44 assert_equals(entries.length, 1, 'Expected exactly one soft navigation.'); 45 assert_equals( 46 entries[0].name.replace(/.*\//, ''), 47 'greeting', 48 'URL ends with \'greeting\'.', 49 ); 50 }, 'DOM: Distant leaf (text) satisfies Soft Navigation paint criterion.');