content-visibility-paint-containment-004.html (984B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <meta charset="utf-8"> 4 <title>content-visibility and paint containment</title> 5 <link rel="help" href="https://drafts.csswg.org/css-contain/#contain-property"> 6 <meta name="assert" content="Verify paint containment works when skipped content gains layer."> 7 <link rel="match" href="content-visibility-paint-containment-004-ref.html"> 8 9 <script src="/common/reftest-wait.js"></script> 10 <script src="/common/rendering-utils.js"></script> 11 12 <style> 13 .hiddenContent { 14 content-visibility: hidden; 15 height: 200px; 16 } 17 </style> 18 19 <div class=hiddenContent> 20 <div id=parentBlock> 21 <div id=childContent></div> 22 </div> 23 </div> 24 25 <script> 26 27 async function runTest() { 28 childContent.style.position = "relative"; 29 parentBlock.offsetLeft; 30 childContent.innerText = "PASS if content stays hidden"; 31 parentBlock.offsetLeft; 32 await waitForAtLeastOneFrame(); 33 takeScreenshot(); 34 } 35 36 window.onload = () => { requestAnimationFrame(runTest); }; 37 </script> 38 </html>