scroll-to-text.html (1180B)
1 <!DOCTYPE HTML> 2 <meta charset=utf-8> 3 <title>Element Timing: observe text that is initially not visible</title> 4 <body> 5 <style> 6 .big { 7 width: 100%; 8 height: 100vh; 9 } 10 </style> 11 <script src="/resources/testharness.js"></script> 12 <script src="/resources/testharnessreport.js"></script> 13 <script src="resources/element-timing-helpers.js"></script> 14 <div class='big'></div> 15 <p elementtiming='observeMe'>Test text</p> 16 <script> 17 async_test((t) => { 18 assert_implements(window.PerformanceElementTiming, "PerformanceElementTiming is not implemented"); 19 const observer = new PerformanceObserver(t.step_func_done(() => {})); 20 observer.observe({type: 'element', buffered: true}); 21 window.onload = () => { 22 // The div occupies the whole screen because it occupies 100% of the height. 23 // We scroll to the end of the document so that the paragraph becomes visible. 24 // A user agent could paint the text before or after scrolling, but either way 25 // it must produce an entry for it. 26 window.scrollTo(0,document.scrollingElement.scrollHeight); 27 }; 28 }, 'Paragraph with elementtiming attribute is observed even when not initially visible.'); 29 </script> 30 </body>