redirects-tao-star.html (2160B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title>This test validates LargestContentfulPaint information for cross-origin redirect chain images.</title> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <script src="resources/largest-contentful-paint-helpers.js"></script> 9 <script src=/common/get-host-info.sub.js></script> 10 </head> 11 <body> 12 <script> 13 setup({"hide_test_state": true}); 14 async_test(t => { 15 assert_implements(window.LargestContentfulPaint, "LargestContentfulPaint is not implemented"); 16 let destUrl = get_host_info().HTTP_REMOTE_ORIGIN 17 + '/resource-timing/resources/multi_redirect.py?'; 18 destUrl += 'page_origin=' + get_host_info().HTTP_ORIGIN; 19 destUrl += '&cross_origin=' + get_host_info().HTTP_REMOTE_ORIGIN; 20 destUrl += '&final_resource=/element-timing/resources/circle-tao.svg'; 21 destUrl += '&tao_steps='; 22 const sizes = [50*50, 66*66, 100*100, 200*200]; 23 24 const image = document.createElement('img'); 25 image.src = destUrl + '0'; 26 image.setAttribute('id', 'id'); 27 image.width = 200 / 4; 28 document.body.appendChild(image); 29 30 let numObserved = 0; 31 let beforeLoad = performance.now(); 32 new PerformanceObserver(t.step_func(entries => { 33 assert_equals(entries.getEntries().length, 1); 34 const entry = entries.getEntries()[0]; 35 const options = numObserved === 3 ? [] : ['renderTimeIs0']; 36 checkImage(entry, destUrl + numObserved, 'id', sizes[numObserved], beforeLoad, options); 37 numObserved++; 38 if (numObserved === 4) 39 t.done(); 40 else { 41 // Change the image to trigger a new LCP entry. 42 const img = document.getElementById('id'); 43 image.src = destUrl + numObserved; 44 // Use monotonically increasing image sizes to trigger LCP every time. 45 image.width = 200 / (4 - numObserved); 46 beforeLoad = performance.now(); 47 } 48 })).observe({type: 'largest-contentful-paint'}); 49 }, 'Cross-origin image without TAO should not have its renderTime set, with full TAO it should.'); 50 </script> 51 </body> 52 </html>