Blitz - WPT: content-visibility-paint-containment-004.html

wpt / css / css-contain / content-visibility / content-visibility-paint-containment-004.html

/css/css-contain/content-visibility/content-visibility-paint-containment-004.html

<!DOCTYPE html>
<html class="reftest-wait">
<meta charset="utf-8">
<title>content-visibility and paint containment</title>
<link rel="help" href="https://drafts.csswg.org/css-contain/#contain-property">
<meta name="assert" content="Verify paint containment works when skipped content gains layer.">
<link rel="match" href="content-visibility-paint-containment-004-ref.html">

<script src="/common/reftest-wait.js"></script>
<script src="/common/rendering-utils.js"></script>

<style>
.hiddenContent {
  content-visibility: hidden;
  height: 200px;
}
</style>

<div class=hiddenContent>
  <div id=parentBlock>
    <div id=childContent></div>
  </div>
</div>

<script>

async function runTest() {
  childContent.style.position = "relative";
  parentBlock.offsetLeft;
  childContent.innerText = "PASS if content stays hidden";
  parentBlock.offsetLeft;
  await waitForAtLeastOneFrame();
  takeScreenshot();
}

window.onload = () => { requestAnimationFrame(runTest); };
</script>
</html>

/css/css-contain/content-visibility/content-visibility-paint-containment-004-ref.html

<!DOCTYPE html>
<html>
<title>content-visibility and paint containment (reference)</title>
<!-- PASS if content stays hidden -->
</html>