| <!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> |
