Index: LayoutTests/css3/compositing/mix-blend-mode-isolation-remove.html |
diff --git a/LayoutTests/css3/compositing/mix-blend-mode-isolation-remove.html b/LayoutTests/css3/compositing/mix-blend-mode-isolation-remove.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..4a241970905d4cae78e41b47c5b15469d87beaca |
--- /dev/null |
+++ b/LayoutTests/css3/compositing/mix-blend-mode-isolation-remove.html |
@@ -0,0 +1,60 @@ |
+<html> |
+<head> |
+<script> |
+ if (window.testRunner) { |
+ window.testRunner.dumpAsText(); |
+ window.testRunner.waitUntilDone(); |
+ } |
+ |
+ function done() { |
+ if (window.testRunner) |
+ window.testRunner.notifyDone(); |
+ } |
+ |
+ function dumpTreeAsText() { |
+ if (!window.internals) |
+ return; |
+ document.getElementById('layers').textContent = |
+ window.internals.layerTreeAsText(document); |
+ document.getElementById('test').style.display = 'none'; |
+ done(); |
+ } |
+ |
+ function removeStackingContext() { |
+ var intermediary = document.getElementById("intermediary"); |
+ intermediary.setAttribute("class", "accelerated-no-stacking-context"); |
+ if (window.testRunner) |
+ window.setTimeout(dumpTreeAsText, 0); |
+ } |
+ |
+ window.addEventListener('load', function () { |
+ window.setTimeout(removeStackingContext, 100); |
+ }, false); |
+</script> |
+<style> |
+.accelerated, |
+.accelerated-stacking-context { |
+ -webkit-transform: rotateX(0deg); |
+} |
+.accelerated-no-stacking-context { |
+ -webkit-backface-visibility: hidden; |
+} |
+.blended { |
+ mix-blend-mode: multiply; |
+} |
+</style> |
+</head> |
+<body> |
+ <div id="test"> |
+ <!--This test checks that isolation property is removed when the element |
+ no longer requires stacking context and it remains accelerated. --> |
+ <div class="accelerated-stacking-context" style="background-color: blue;"> |
+ <div id="intermediary" class="accelerated-stacking-context" |
+ style="background-color: green; height: 90px;"> |
+ <img class="accelerated blended" src="resources/reference.png"> |
+ </div> |
+ </div> |
+ </div> |
+ <pre id="layers">Layer tree goes here when testing.</pre> |
+</body> |
+</html> |