blob: a5a5557ddf5215ddec5464f7f0fede0d5bd275f9 [file] [log] [blame]
<html>
<head>
<script src="../../../resources/js-test-pre.js"></script>
<style>
.visible { position: absolute; }
.hidden { position: relative; display: none; }
</style>
</head>
<body>
<div id="test">Tests that getComputedStyle returns length properties with a unit.</div>
<div id="console"></div>
<script>
var propertiesToCheck = {
"background-position": "10px 10px",
"background-size": "400px 300px",
"-webkit-border-horizontal-spacing": "10px",
"-webkit-border-vertical-spacing": "10px",
"border-top-width": "2px",
"border-right-width": "2px",
"border-bottom-width": "2px",
"border-left-width": "2px",
"border-top-left-radius": "5px",
"border-top-right-radius": "5px",
"border-bottom-left-radius": "5px",
"border-bottom-right-radius": "5px",
"outline-width": "2px",
"-webkit-column-rule-width": "10px",
"-webkit-column-width": "80px",
"-webkit-column-gap": "20px",
"-webkit-marquee-increment": "10px",
"-webkit-mask-position": "10px 10px",
"-webkit-mask-size": "10px 10px",
"-webkit-perspective": "400px",
"-webkit-perspective-origin": "20px 20px",
"-webkit-text-stroke-width": "2px",
"-webkit-transform-origin": "10px 10px",
"left": "20px",
"top": "20px",
"right": "50px",
"bottom": "50px",
"font-size": "20px",
"width": "400px",
"max-width": "900px",
"min-width": "200px",
"height": "250px",
"max-height": "600px",
"min-height": "200px",
"letter-spacing": "2px",
"word-spacing": "10px",
"margin-top": "10px",
"margin-right": "10px",
"margin-bottom": "10px",
"margin-left": "10px",
"padding-top": "10px",
"padding-right": "10px",
"padding-bottom": "10px",
"padding-left": "10px",
"text-indent": "10px"
};
var testElement = document.getElementById('test');
for (var propertyName in propertiesToCheck)
testElement.style[propertyName] = propertiesToCheck[propertyName];
function testPropertyUnit(className, propertyName)
{
if (testElement.className != className)
testElement.className = className;
var computedStyled = document.defaultView.getComputedStyle(testElement);
var results = /\d+([a-z%]+)/.exec(computedStyled[propertyName]);
return results ? results[1] : '';
}
for (var propertyName in propertiesToCheck)
shouldBe("testPropertyUnit('visible', '" + propertyName + "')", "'px'");
for (var propertyName in propertiesToCheck)
shouldBe("testPropertyUnit('hidden', '" + propertyName + "')", "'px'");
for (var propertyName in propertiesToCheck)
testElement.style[propertyName] = '';
</script>
</body>
</html>