| Index: LayoutTests/fast/repaint/mix-blend-mode-separate-stacking-context.html
|
| diff --git a/LayoutTests/fast/repaint/mix-blend-mode-separate-stacking-context.html b/LayoutTests/fast/repaint/mix-blend-mode-separate-stacking-context.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..d89c7ed78e6a5d808969207a964af56f22524147
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/repaint/mix-blend-mode-separate-stacking-context.html
|
| @@ -0,0 +1,38 @@
|
| +<!DOCTYPE HTML>
|
| +<html>
|
| +<head>
|
| +<style>
|
| + div {
|
| + margin: 20px;
|
| + width: 60px;
|
| + height: 60px;
|
| + float: left;
|
| + }
|
| +</style>
|
| +<script src="resources/repaint.js" type="text/javascript"></script>
|
| +<!-- Repaint test to ensure that setting a blend mode dynamically triggers this operation
|
| + only with the contents of the nearest ancestor stacking context. -->
|
| +<body onload="runRepaintTest()">
|
| + <div style="background: green; position: relative; z-index: -1;">
|
| + <div id="first" style="mix-blend-mode: normal; background-color: blue;"></div>
|
| + </div>
|
| + <div style="background: green; position: relative; z-index: -1;">
|
| + <div id="second" style="mix-blend-mode: hue; background-color: blue;"></div>
|
| + </div>
|
| + <div style="background: green; position: relative; z-index: -1;">
|
| + <div id="third" style="mix-blend-mode: hue; background-color: blue;"></div>
|
| + </div>
|
| + <div id="fourth" style="background: green;">
|
| + <div style="mix-blend-mode: hue; background-color: blue;"></div>
|
| + </div>
|
| +
|
| + <script>
|
| + function repaintTest() {
|
| + document.getElementById('first').style.mixBlendMode = "multiply";
|
| + document.getElementById('second').style.mixBlendMode = "normal";
|
| + document.getElementById('third').style.mixBlendMode = "multiply";
|
| + document.getElementById('fourth').style.position = "relative";
|
| + document.getElementById('fourth').style.zIndex = -1;
|
| + }
|
| + </script>
|
| +</body>
|
|
|