blob: a97e0a7e87e5a10f5ed27700b9ae959db4aee499 [file] [log] [blame]
<!-- Based on compositing/repaint/clipping-should-not-repaint-composited-descendants.html -->
<!DOCTYPE html>
<style>
.spacer {
position: relative;
width: 300px;
height: 300px;
}
.clipping-container {
position: absolute;
height: 300px;
transform: translateZ(0);
}
.with-initial-clipping {
clip: rect(50px, 250px, 250px, 50px);
}
.clipped-composited-child {
width: 250px;
height: 250px;
background-color: yellow;
border: 1px solid black;
transform: translateZ(0);
}
</style>
<style id="alt1">
.clipping-container {
width: 300px;
}
</style>
<style id="alt2">
.clipping-container {
width: 100%;
clip: rect(100px, 200px, 200px, 100px);
}
</style>
<script src="resources/paint-invalidation-test.js"></script>
<script>
var alt1 = document.getElementById('alt1');
var alt2 = document.getElementById('alt2');
alt2.disabled = true;
window.expectedPaintInvalidationObjects = [
];
function paintInvalidationTest() {
alt2.disabled = false;
alt1.disabled = true;
}
runPaintInvalidationTest();
</script>
<div class="spacer">
<div class="clipping-container">
<div class="clipped-composited-child"></div>
</div>
</div>
<div class="spacer">
<div class="clipping-container with-initial-clipping">
<div class="clipped-composited-child"></div>
</div>
</div>