blob: 4413735a428e3bbb34c9e61af2bc473e184a762f [file] [log] [blame]
<!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>