iframe-loading-lazy-load-event.html (1776B)
1 <!DOCTYPE html> 2 <head> 3 <title>In-viewport loading=lazy iframes do not block the window load event</title> 4 <link rel="author" title="Dom Farolino" href="mailto:dom@chromium.org"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="../resources/common.js"></script> 8 </head> 9 10 <body> 11 <!-- This image blocks the window load event for 1 second --> 12 <img src="/common/square.png?pipe=trickle(d1)"> 13 14 <!-- These iframes must load because they intersect the viewport, but they must 15 not block the window load event, because they are loading=lazy --> 16 <iframe id="visible" loading="lazy" 17 src="resources/subframe.html?visible&pipe=trickle(d3)"></iframe> 18 <iframe id="visibility_hidden" style="visibility:hidden;" loading="lazy" 19 src="resources/subframe.html?visibility_hidden&pipe=trickle(d3)"></iframe> 20 </body> 21 22 <script> 23 const visible_iframe = document.querySelector('#visible'); 24 const hidden_iframe = document.querySelector('#visibility_hidden'); 25 26 const visible_iframe_t = 27 async_test('In-viewport loading=lazy iframe does not block the load event'); 28 29 const hidden_iframe_t = 30 async_test('In-viewport loading=lazy visibility:hidden iframe does not ' + 31 'block the load event'); 32 33 let has_window_loaded = false; 34 window.addEventListener("load", () => { 35 has_window_loaded = true; 36 }); 37 38 visible_iframe.onload = visible_iframe_t.step_func_done(() => { 39 assert_true(has_window_loaded, 40 "The visible iframe should not block the load event"); 41 }); 42 43 hidden_iframe.onload = hidden_iframe_t.step_func_done(() => { 44 assert_true(has_window_loaded, 45 "The hidden iframe should not block the load event"); 46 }); 47 </script>