iframe-loading-lazy-in-scroller-nested-3.html (1135B)
1 <!DOCTYPE html> 2 <link rel="help" href="https://html.spec.whatwg.org/#lazy-load-root-margin"> 3 <script src="/resources/testharness.js"></script> 4 <script src="/resources/testharnessreport.js"></script> 5 6 <style> 7 #scroller { 8 width: 100px; 9 height: 100px; 10 overflow: scroll; 11 background-color: gray; 12 } 13 14 #scroller2 { 15 width: 110px; 16 height: 110px; 17 overflow: scroll; 18 } 19 20 #scroller3 { 21 width: 120px; 22 height: 120px; 23 overflow: scroll; 24 } 25 26 #spacer { 27 width: 130px; 28 height: 130px; 29 } 30 31 #target { 32 width: 100px; 33 height: 100px; 34 } 35 </style> 36 37 <div id=scroller3> 38 <div id=scroller2> 39 <div id="scroller"> 40 <div id="spacer"></div> 41 <iframe 42 id="target" 43 src="resources/subframe.html" 44 loading="lazy" 45 onload="iframe_onload();" 46 ></iframe> 47 </div> 48 </div> 49 </div> 50 51 <script> 52 const t = async_test( 53 "Test that lazy-loaded iframes load when near viewport." 54 ); 55 56 function iframe_onload() { 57 t.done(); 58 } 59 60 t.step_timeout(() => { 61 t.unreached_func( 62 "Timed out while waiting for iframe to load." 63 )(); 64 }, 2000); 65 </script>