Index: LayoutTests/css3/compositing/mix-blend-mode-2nd-stacking-context-composited.html |
diff --git a/LayoutTests/css3/compositing/mix-blend-mode-2nd-stacking-context-composited.html b/LayoutTests/css3/compositing/mix-blend-mode-2nd-stacking-context-composited.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..c8cd775cdc70821ae71f13566782ff7e98144aa6 |
--- /dev/null |
+++ b/LayoutTests/css3/compositing/mix-blend-mode-2nd-stacking-context-composited.html |
@@ -0,0 +1,37 @@ |
+<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 mix-blend-mode property doesn't make |
+ the element or its stacking context to be accelerated--> |
+ <div class="accelerated stacking-context" style="background-color:red"> |
+ <div class="stacking-context" style="background-color: green"> |
+ <img class="blended" src="resources/reference.png"> |
+ </div> |
+ </div> |
+ </div> |
+ <pre id="layers">Layer tree goes here when testing.</pre> |
+</body> |
+</html> |