content-visibility-hidden-document-reflow-count.html (1243B)
1 <!DOCTYPE html> 2 <html> 3 <meta charset="utf-8"> 4 <title>CSS Contain: Test content-visibility:hidden reflow counts</title> 5 <link rel="author" title="Martin Robinson" href="mailto:mrobinson@igalia.com"> 6 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 10 <body style="content-visibility: hidden;"> 11 hello 12 </body> 13 14 <script> 15 let gUtils = SpecialPowers.getDOMWindowUtils(window); 16 let gTestContainer = document.getElementById("test"); 17 18 function flushLayout() { 19 document.documentElement.offsetHeight; 20 } 21 22 function getReflowCount() { 23 flushLayout(); 24 return gUtils.framesReflowed; 25 } 26 27 function runTestFunctionAndCountReflows(testFunction) { 28 const beforeCount = getReflowCount(); 29 testFunction(); 30 const afterCount = getReflowCount(); 31 console.log(afterCount - beforeCount); 32 return afterCount - beforeCount; 33 } 34 35 test(() => { 36 flushLayout(); 37 38 const reflows = runTestFunctionAndCountReflows(() => { 39 document.body.innerText = "something else"; 40 }); 41 assert_equals(reflows, 1, "Reflow only triggered on body."); 42 }, "Changing text of 'content-visibility: hidden' body only triggers a single reflow."); 43 </script> 44 </html>