| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/resources/testdriver.js"></script> |
| <script src="/resources/testdriver-vendor.js"></script> |
| <script src="resources/soft-navigation-helper.js"></script> |
| </head> |
| <body> |
| <main id=main> |
| <div> |
| <a id=link><img src="/images/lcp-256x256.png" id="img"></a> |
| <a id=not_nav><img src="/images/lcp-16x16.png"></a> |
| </div> |
| </main> |
| <script> |
| // Push state a couple of times |
| history.pushState({}, "", "foobar.html"); |
| history.pushState({}, "", "anotherOne.html"); |
| |
| (async () => { |
| const link = document.getElementById("link"); |
| // Trigger a user interaction that doesn't result in a soft navigation, but |
| // does paint. |
| await (async () => { |
| const not_nav = document.getElementById("not_nav"); |
| let non_soft_nav_click; |
| const non_soft_nav_click_promise = |
| new Promise(r => { non_soft_nav_click = r; }); |
| not_nav.addEventListener("click", () => { |
| addImageToMain("lcp-133x106.png", "not_soft_nav_image"); |
| (new PerformanceObserver(non_soft_nav_click)).observe({type: "element"}); |
| }); |
| if (test_driver) { |
| test_driver.click(not_nav); |
| } |
| await non_soft_nav_click_promise; |
| })(); |
| const url = URL + "?" + counter; |
| link.addEventListener("click", () => { |
| // Add an LCP element. |
| const img = new Image(); |
| img.src = '/images/lcp-100x500.png' + "?" + Math.random(); |
| document.getElementById("main").appendChild(img); |
| history.back(); |
| }); |
| promise_test(async t => { |
| if (test_driver) { |
| test_driver.click(link); |
| } |
| await waitOnSoftNav(); |
| assert_equals( |
| document.softNavigations, 1, |
| 'Single Soft Navigation detected'); |
| const [entries, options] = await new Promise(resolve => { |
| (new PerformanceObserver((list, obs, options) => resolve( |
| [list.getEntries(), options]))).observe( |
| {type: 'soft-navigation', buffered: true}); |
| }); |
| |
| assert_equals(entries.length, 1, |
| "Performance observer got an entry"); |
| }, "Ensure that soft navigation entry emitted through a synchronous " + |
| "event that modified DOM and committed a same document navigation, " + |
| "and that was preceded by a user intreaction that resulted in a " + |
| "contentful paint is properly detected."); |
| })(); |
| </script> |
| </body> |
| </html> |
| |
| |
| |
| |