blob: 260fe39e093e57bdb808b16d26d24e60d6c27428 [file] [log] [blame]
<!doctype html>
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
</head>
<body>
<p>This tests the border width property with percent values for HTML elements.</p>
<div id="console"></div>
<script>
function elementBorderWidth(element, borderValue, style)
{
var element = document.createElement(element);
if (borderValue !== undefined)
element.setAttribute("border", borderValue);
element.setAttribute("style", style);
element.setAttribute("width", "0");
document.body.appendChild(element);
var borderBoxWidth = element.offsetWidth;
document.body.removeChild(element);
return borderBoxWidth / 2;
}
function inputElementBorderWidth(elementType, borderValue, style)
{
var inputElement = document.createElement("input");
inputElement.setAttribute("type", elementType);
if (borderValue != undefined)
inputElement.setAttribute("border", borderValue);
inputElement.setAttribute("style", style);
inputElement.setAttribute("width", "0");
document.body.appendChild(inputElement);
var borderBoxWidth = inputElement.offsetWidth;
document.body.removeChild(inputElement);
return borderBoxWidth / 2;
}
shouldBe("elementBorderWidth('img', '10%')", "10");
shouldBe("elementBorderWidth('img', '-10%')", "0");
shouldBe("elementBorderWidth('img', ' +10%')", "10");
shouldBe("elementBorderWidth('img', 0, 'border-width: 10%')", "0");
shouldBe("elementBorderWidth('img', 0, 'border-width: -10%')", "0");
shouldBe("elementBorderWidth('object', '10%')", "10");
shouldBe("elementBorderWidth('object', '-10%')", "0");
shouldBe("elementBorderWidth('object', ' +10%')", "10");
shouldBe("elementBorderWidth('object', 0, 'border-width: 10%')", "0");
shouldBe("elementBorderWidth('object', 0, 'border-width: -10%')", "0");
shouldBe("inputElementBorderWidth('image', '10%')", "10");
shouldBe("inputElementBorderWidth('image', '-10%')", "0");
shouldBe("inputElementBorderWidth('image', ' +10%')", "10");
shouldBe("inputElementBorderWidth('image', 0, 'border-width: 10%')", "0");
shouldBe("inputElementBorderWidth('image', 0, 'border-width: -10%')", "0");
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>