web-font-styled-text-resize-swap-smaller.html (2121B)
1 <!DOCTYPE html> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 <style> 5 @font-face { 6 font-family: 'TestFaceSmaller'; 7 src: url('/fonts/CSSTest/csstest-basic-regular.ttf?pipe=trickle(d0.5)'); 8 size-adjust: 30%; 9 font-display: swap; 10 } 11 12 .test { 13 font-family: 'TestFaceSmaller'; 14 } 15 16 </style> 17 <!-- 18 Web-font styled text that gets resized during swap period should not make a 19 LCP emission if the new size is smaller than the current LCP element size. 20 --> 21 <div class="test">LCP: Web Font Styled Text Resize</div> 22 <script> 23 function LCPEntryList(t) { 24 return new Promise(resolve => { 25 let = lcpEntries = []; 26 new PerformanceObserver((entryList, observer) => { 27 lcpEntries = lcpEntries.concat(entryList.getEntries()); 28 if (lcpEntries) { 29 // Adding timeout to wait a bit more so that if there are more than 30 // expected LCP entries emitted, they can be observed. 31 t.step_timeout(() => { 32 resolve(lcpEntries); 33 observer.disconnect(); 34 }, 200); 35 } 36 }).observe({ type: 'largest-contentful-paint', buffered: true }); 37 }); 38 } 39 40 promise_test(async t => { 41 await document.fonts.ready; 42 43 // Verify web font is loaded. 44 assert_own_property(window, 'PerformanceResourceTiming', "ResourceTiming not supported"); 45 let url = '/fonts/CSSTest/csstest-basic-regular.ttf?pipe=trickle(d0.5)'; 46 var absoluteURL = new URL(url, location.href).href; 47 assert_equals(performance.getEntriesByName(absoluteURL).length, 1, 'Web font should be downloaded'); 48 49 // Verify web font is available. 50 assert_true(document.fonts.check('10px TestFaceSmaller'), 'Font should be the web font added'); 51 52 // Verify there is only one LCP entry. 53 let entryList = await LCPEntryList(t); 54 assert_equals(entryList.length, 1, 'Web font styled text resize that occurs during swap period but is smaller should not make a new LCP emission.') 55 56 }, "LCP should be not updated if the web font styled text resizes to be smaller during the swap period"); 57 </script>