Index: LayoutTests/css3/compositing/mix-blend-mode-composited-reason-children.html |
diff --git a/LayoutTests/css3/compositing/mix-blend-mode-composited-reason-children.html b/LayoutTests/css3/compositing/mix-blend-mode-composited-reason-children.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..378211d1b6ad216d96ae7fabfeed18105d3654fa |
--- /dev/null |
+++ b/LayoutTests/css3/compositing/mix-blend-mode-composited-reason-children.html |
@@ -0,0 +1,40 @@ |
+<html> |
+<head> |
+<script> |
+ if (window.testRunner) { |
+ testRunner.dumpAsText(); |
+ window.addEventListener('load', function () { |
+ document.getElementById('layers').textContent = window.internals.layerTreeAsText(document); |
+ document.getElementById('test').style.display = 'none'; |
+ }, false); |
+ } |
+</script> |
+<style> |
+.stacking-context { |
+ position: absolute; |
+ z-index: -1; |
+} |
+.accelerated { |
+ -webkit-transform: rotateX(0deg); |
+} |
+.blended { |
+ mix-blend-mode: multiply; |
+} |
+</style> |
+</head> |
+<body> |
+ <div id="test"> |
+ <!--This test makes sure that a blending element having accelerated |
+ descendants will get accelerated and its stacking context element |
+ will get accelerated as well--> |
+ <div class="stacking-context" style="background-color:red"> |
+ <div class="stacking-context" style="background-color: green"> |
+ <div class="blended" style="background-color: blue"> |
+ <img class="accelerated" src="resources/reference.png"> |
+ </div> |
+ </div> |
+ </div> |
+ </div> |
+ <pre id="layers">Layer tree goes here when testing.</pre> |
+</body> |
+</html> |