60 lines
3.1 KiB
HTML
60 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<div id="parentDiv" style="-webkit-perspective: 150px; -webkit-perspective-origin: 10px 10px; width: 400px; height: 400px">
|
|
<div id="testDiv" style="-webkit-perspective: 100px; -webkit-perspective-origin: 5px 5px; width: 200px; height: 200px"></div>
|
|
<div id="noShortHandDiv" style="-webkit-perspective: 200px; -webkit-perspective-origin: 15px 15px; width: 300px; height: 300px"></div>
|
|
</div>
|
|
<script>
|
|
description("Tests that setting -webkit-perspective-origin property is corrected parsed / computed.");
|
|
|
|
var parentDiv = document.getElementById("parentDiv");
|
|
var testDiv = document.getElementById("testDiv");
|
|
var noShortHandDiv = document.getElementById("noShortHandDiv");
|
|
|
|
shouldBeEqualToString("getComputedStyle(parentDiv)['-webkit-perspective']", "150px");
|
|
shouldBeEqualToString("getComputedStyle(parentDiv)['-webkit-perspective-origin']", "10px 10px");
|
|
// Not implemented.
|
|
shouldBeEmptyString("getComputedStyle(parentDiv)['-webkit-perspective-origin-x']");
|
|
shouldBeEmptyString("getComputedStyle(parentDiv)['-webkit-perspective-origin-y']");
|
|
|
|
shouldBeEqualToString("getComputedStyle(testDiv)['-webkit-perspective']", "100px");
|
|
shouldBeEqualToString("getComputedStyle(testDiv)['-webkit-perspective-origin']", "5px 5px");
|
|
// Not implemented.
|
|
shouldBeEmptyString("getComputedStyle(testDiv)['-webkit-perspective-origin-x']");
|
|
shouldBeEmptyString("getComputedStyle(testDiv)['-webkit-perspective-origin-y']");
|
|
|
|
shouldBeEqualToString("getComputedStyle(noShortHandDiv)['-webkit-perspective']", "200px");
|
|
shouldBeEqualToString("getComputedStyle(noShortHandDiv)['-webkit-perspective-origin']", "15px 15px");
|
|
// Not implemented.
|
|
shouldBeEmptyString("getComputedStyle(noShortHandDiv)['-webkit-perspective-origin-x']");
|
|
shouldBeEmptyString("getComputedStyle(noShortHandDiv)['-webkit-perspective-origin-y']");
|
|
|
|
evalAndLog("testDiv.style['-webkit-perspective-origin'] = 'inherit'");
|
|
shouldBeEqualToString("getComputedStyle(testDiv)['-webkit-perspective-origin']", "10px 10px");
|
|
|
|
evalAndLog("testDiv.style['-webkit-perspective-origin'] = 'initial'");
|
|
// Initial is '50% 50%' -> '100px 100px', because width / height are 100px.
|
|
shouldBeEqualToString("getComputedStyle(testDiv)['-webkit-perspective-origin']", "100px 100px");
|
|
|
|
evalAndLog("testDiv.style['-webkit-perspective-origin'] = '20px 20px'");
|
|
shouldBeEqualToString("getComputedStyle(testDiv)['-webkit-perspective-origin']", "20px 20px");
|
|
|
|
evalAndLog("noShortHandDiv.style['-webkit-perspective-origin'] = 'inherit'");
|
|
shouldBeEqualToString("getComputedStyle(noShortHandDiv)['-webkit-perspective-origin']", "10px 10px");
|
|
|
|
evalAndLog("noShortHandDiv.style['-webkit-perspective-origin'] = 'initial'");
|
|
// Initial is '50% 50%' -> '150px 150px', because width / height are 300px.
|
|
shouldBeEqualToString("getComputedStyle(noShortHandDiv)['-webkit-perspective-origin']", "150px 150px");
|
|
|
|
evalAndLog("noShortHandDiv.style['-webkit-perspective-origin'] = '20px 20px'");
|
|
shouldBeEqualToString("getComputedStyle(noShortHandDiv)['-webkit-perspective-origin']", "20px 20px");
|
|
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|