placeholder-image.html (1273B)
1 <!DOCTYPE HTML> 2 <meta charset=utf-8> 3 <title>Largest Contentful Paint: src change triggers new entry.</title> 4 <body> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="resources/largest-contentful-paint-helpers.js"></script> 8 <img src='/images/lcp-1x1.png' id='image_id' width="133" height="106"/> 9 <script> 10 async_test(function (t) { 11 assert_implements(window.LargestContentfulPaint, "LargestContentfulPaint is not implemented"); 12 let beforeLoad = performance.now(); 13 document.getElementById('image_id').src = '/images/lcp-133x106.png'; 14 const url = window.location.origin + '/images/lcp-133x106.png'; 15 const observer = new PerformanceObserver( 16 t.step_func(function(entryList) { 17 let entries = entryList.getEntries().filter(e => e.url === url); 18 if (entries.length === 0) 19 return; 20 assert_equals(entries.length, 1); 21 const entry = entries[0]; 22 const size = 133 * 106; 23 checkImage(entry, url, 'image_id', size, beforeLoad); 24 t.done(); 25 }) 26 ); 27 observer.observe({type: 'largest-contentful-paint', buffered: true}); 28 }, 'Largest Contentful Paint: changing src causes a new entry to be dispatched.'); 29 </script> 30 </body>