<!DOCTYPE html>
<style>
#composited-box {
    will-change: transform;
    position: absolute;
    background-color: green;
    clip: rect(40px, 110px, 110px, 40px);
}
.child {
    width: 50px;
    height: 50px;
    background-color: green;
}
.composited {
    will-change: transform;
}
</style>
<script src="../resources/text-based-repaint.js"></script>
<script>
function repaintTest() {
    // This will cause a full layer repaint, but should not include the composited child.
    document.getElementById('composited-box').style.clip = 'rect(30px, 120px, 120px, 30px)';
}
window.onload = runRepaintTest;
</script>
<div id="composited-box">
    <div class="child"></div>
    <div class="composited child"></div>
</div>