| <!DOCTYPE HTML> |
| <link rel="stylesheet" href="resources/blending-style.css"> |
| |
| <p>Test that an element with mix-blend-mode other than normal forces the computed value of transform-style to flat.</p> |
| <div id="blend-mode-normal-with-transform-style-preserve-3d" class="box" style="-webkit-transform-style: preserve-3d;"></div> |
| <div id="blending-with-transform-style-preserve-3d" class="box difference" style="-webkit-transform-style: preserve-3d;"></div> |
| <div id="blending-with-transform-style-flat" class="box difference" style="-webkit-transform-style: flat;"></div> |
| <script src="../../resources/js-test.js"></script> |
| <script> |
| function getTransformStyle(elementID) { |
| return getComputedStyle(document.getElementById(elementID)).webkitTransformStyle; |
| } |
| |
| function test(id, expected) { |
| shouldBeEqualToString('getTransformStyle("' + id + '")', expected); |
| } |
| |
| test("blend-mode-normal-with-transform-style-preserve-3d", "preserve-3d"); |
| test("blending-with-transform-style-preserve-3d", "flat"); |
| test("blending-with-transform-style-flat", "flat"); |
| </script> |