squashing-inside-preserve-3d-element.html

<!doctype html>
<div style="transform-style: preserve-3d">
  <div style="width: 100px; height: 100px; background:lightgray; will-change: transform;"></div>
  <div id="target" style="position: absolute; top: 20px; left: 20px; height: 100px; width: 100px; background:lightblue"></div>
</div>
<script src="../resources/text-based-repaint.js"></script>
<script>
// Test that squashing works properly when inside of a transform-style: preserve-3d element. In the bug that this layout test
// was added to fix, the coordinates of the squashing layer paint invalidation rects were not recorded correctly, because some of
// the code computed transformed ancestors incorrectly (it should *not* include the preserve-3d element).

function repaintTest() {
    var target = document.getElementById('target');
    target.style.background = 'red';
}

runRepaintAndPixelTest();
</script>

chromium/third_party/blink/web_tests/paint/invalidation/compositing/squashing-inside-preserve-3d-element.html