<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<p>Test computed style for the overflow property of select element</p>
<div id="console"></div>
<div id="test">
<select id="wut" name="wut" size="8">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
<option value="5">Five</option>
<option value="6">Six</option>
<option value="7">Seven</option>
<option value="8">Eight</option>
<option value="9">Nine</option>
<option value="10">Ten</option>
</select>
</div>
<script>
function computedOverflowStyle(overflowStyle, property) {
var selectElement = document.getElementById("wut");
selectElement.style.overflow = overflowStyle;
return window.getComputedStyle(selectElement).getPropertyValue(property);
}
function computedInheritedOverflowStyle(overflowStyle, property) {
var divElement = document.getElementById("test");
divElement.style.overflow = 'scroll';
var selectElement = document.getElementById("wut");
selectElement.style.overflow = overflowStyle;
return window.getComputedStyle(selectElement).getPropertyValue(property);
}
shouldBe("computedOverflowStyle('scroll', 'overflow-x')", "'scroll'");
shouldBe("computedOverflowStyle('scroll', 'overflow-y')", "'scroll'");
shouldBe("computedInheritedOverflowStyle('inherit', 'overflow-x')", "'scroll'");
shouldBe("computedInheritedOverflowStyle('inherit', 'overflow-y')", "'scroll'");
var successfullyParsed = true;
</script>
</body>
</html>