Index: LayoutTests/compositing/repaint/clipping-should-not-repaint-composited-descendants.html |
diff --git a/LayoutTests/compositing/repaint/clipping-should-not-repaint-composited-descendants.html b/LayoutTests/compositing/repaint/clipping-should-not-repaint-composited-descendants.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..480269643d94ecad59d02ff2a15f86cb02c897ff |
--- /dev/null |
+++ b/LayoutTests/compositing/repaint/clipping-should-not-repaint-composited-descendants.html |
@@ -0,0 +1,78 @@ |
+<!DOCTYPE html> |
+<style> |
+ .spacer { |
+ position: relative; |
+ width: 300px; |
+ height: 300px; |
+ } |
+ |
+ .clipping-container { |
+ position: absolute; |
+ height: 300px; |
+ -webkit-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; |
+ -webkit-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/run-after-display.js"></script> |
+<script> |
+ var alt1 = document.getElementById('alt1'); |
+ var alt2 = document.getElementById('alt2'); |
+ alt2.disabled = true; |
+ |
+ function toggle() { |
+ if (alt1.disabled) { |
+ alt1.disabled = false; |
+ alt2.disabled = true; |
+ } else { |
+ alt2.disabled = false; |
+ alt1.disabled = true; |
+ } |
+ } |
+ |
+ function doTest() { |
+ internals.startTrackingRepaints(document); |
+ toggle(); |
+ document.getElementById("console").textContent = internals.layerTreeAsText(document, internals.LAYER_TREE_INCLUDES_REPAINT_RECTS); |
+ testRunner.notifyDone(); |
+ } |
+ |
+ if (window.testRunner && window.internals) { |
+ testRunner.dumpAsText(); |
+ testRunner.waitUntilDone(); |
+ runAfterDisplay(doTest); |
+ } |
+</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> |
+<pre id="console"></pre> |