Index: LayoutTests/compositing/repaint/should-not-repaint-composited-styles.html |
diff --git a/LayoutTests/compositing/repaint/should-not-repaint-composited-styles.html b/LayoutTests/compositing/repaint/should-not-repaint-composited-styles.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..49ea94926d466079ed0db0a616751aaa793f340d |
--- /dev/null |
+++ b/LayoutTests/compositing/repaint/should-not-repaint-composited-styles.html |
@@ -0,0 +1,93 @@ |
+<!DOCTYPE html> |
+<style> |
+ .spacer { |
+ width: 100px; |
+ height: 100px; |
+ } |
+ |
+ .clipping-container { |
+ -webkit-transform: translateZ(0); |
+ position: relative; |
+ left: 0; |
+ top: 0; |
+ height: 100px; |
+ overflow: hidden; |
+ } |
+ |
+ .child { |
+ width: 150px; |
+ height: 150px; |
+ border: 1px black solid; |
+ background-color: yellow; |
+ } |
+ |
+ .composited { |
+ -webkit-transform: translateZ(0); |
+ } |
+</style> |
+<style id="alt1"> |
+ .clipping-container { width: 100px; } |
+ .position { position: relative; } |
+ .zindex { z-index: 0; } |
+ .opacity { opacity: 0.99; } |
+ .transform { -webkit-transform: translateZ(10px); } |
+ .filter { -webkit-filter: invert(70%); } |
+</style> |
+<style id="alt2"> |
+ .clipping-container { width: 100%; } |
+ .position { position: static; } |
+ .zindex { z-index: 1; } |
+ .opacity { opacity: 0.5; } |
+ .transform { -webkit-transform: translateZ(20px); } |
+ .filter { -webkit-filter: invert(100%); } |
+</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> |
+<h1>position change with composited child</h1> |
+<div class="spacer"><div class="clipping-container position"><div class="child composited"></div></div></div> |
+<h1>position change with non-composited child</h1> |
+<div class="spacer"><div class="clipping-container position"><div class="child"></div></div></div> |
+<h1>z-index change with composited child</h1> |
+<div class="spacer"><div class="clipping-container zindex"><div class="child composited"></div></div></div> |
+<h1>z-index change with non-composited child</h1> |
+<div class="spacer"><div class="clipping-container zindex"><div class="child"></div></div></div> |
+<h1>opacity change with composited child</h1> |
+<div class="spacer"><div class="clipping-container opacity"><div class="child composited"></div></div></div> |
+<h1>opacity change with non-composited child</h1> |
+<div class="spacer"><div class="clipping-container opacity"><div class="child"></div></div></div> |
+<h1>transform change with composited child</h1> |
+<div class="spacer"><div class="clipping-container transform"><div class="child composited"></div></div></div> |
+<h1>transform change with non-composited child</h1> |
+<div class="spacer"><div class="clipping-container transform"><div class="child"></div></div></div> |
+<h1>filter change with composited child</h1> |
+<div class="spacer"><div class="clipping-container filter"><div class="child composited"></div></div></div> |
+<h1>filter change with non-composited child</h1> |
+<div class="spacer"><div class="clipping-container filter"><div class="child"></div></div></div> |
+<pre id="console"></pre> |