transform-inherit-initial-unprefixed.html

<!DOCTYPE html>
<html>
<head>
<script src="../resources/js-test.js"></script>
<style>
#base {
    transform: rotate(60deg);
    transform-origin:20% 40%;
    transform-style: preserve-3d;
}

#inherit {
    transform: inherit;
    transform-origin: inherit;
    transform-style: inherit;
}

#initial {
    transform: initial;
    transform-origin: initial;
    transform-style: initial;
}

</style>
</head>
<body>
<div style="width:500px;height:500px" id="base">
    <div id="inherit"></div>
    <div id="initial"></div>
</div>
<script>
description("Test that inherit and initial works on unprefixed transforms.")

var testContainer = document.createElement("div");
document.body.appendChild(testContainer);

e = document.getElementById('inherit');
computedStyle = window.getComputedStyle(e, null);

debug("Testing inherit.");
shouldBe("computedStyle.transform", "'matrix(0.5, 0.866025, -0.866025, 0.5, 0, 0)'");
shouldBe("computedStyle.webkitTransform", "'matrix(0.5, 0.866025, -0.866025, 0.5, 0, 0)'");
shouldBe("computedStyle.transformOrigin", "'100px 0px'");
shouldBe("computedStyle.webkitTransformOrigin", "'100px 0px'");
shouldBe("computedStyle.transformStyle", "'preserve-3d'");
shouldBe("computedStyle.webkitTransformStyle", "'preserve-3d'");

e = document.getElementById('initial');
computedStyle = window.getComputedStyle(e, null);
debug("Testing initial.");

shouldBe("computedStyle.transform", "'none'");
shouldBe("computedStyle.webkitTransform", "'none'");
shouldBe("computedStyle.transformOrigin", "'250px 0px'");
shouldBe("computedStyle.webkitTransformOrigin", "'250px 0px'");
shouldBe("computedStyle.transformStyle", "'flat'");
shouldBe("computedStyle.webkitTransformStyle", "'flat'");

document.body.removeChild(testContainer);
</script>
</body>
</html>
chromium/third_party/blink/web_tests/transforms/transform-inherit-initial-unprefixed.html
