72 lines
3.1 KiB
HTML
72 lines
3.1 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
<style>
|
|
input {
|
|
background-color: white;
|
|
color: black;
|
|
}
|
|
input:read-only {
|
|
background-color: rgb(1, 2, 3);
|
|
}
|
|
input:read-write {
|
|
color: rgb(4, 5, 6);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div style="display:none">
|
|
<fieldset>
|
|
<legend>Legend!<input type="text" id="input1"></legend>
|
|
<input type="text" id="input2">
|
|
</fieldset>
|
|
|
|
<fieldset disabled>
|
|
<legend>Legend!<input type="text" id="input3"></legend>
|
|
<input type="text" id="input4">
|
|
</fieldset>
|
|
|
|
<fieldset id="disabled-dynamically">
|
|
<legend>Legend!<input type="text" id="input5"></legend>
|
|
<input type="text" id="input6">
|
|
</fieldset>
|
|
</div>
|
|
</body>
|
|
<script>
|
|
description('Test the basic features of ":read-only", ":read-write" on the <input> element. In a fieldset, all elements that are not part of the legend are disabled if the fieldset is disabled.');
|
|
|
|
document.getElementById("disabled-dynamically").disabled = true;
|
|
|
|
shouldBe("document.querySelectorAll(\"input:read-write\").length", "4");
|
|
shouldBeEqualToString("document.querySelectorAll(\"input:read-write\")[0].id", "input1");
|
|
shouldBeEqualToString("document.querySelectorAll(\"input:read-write\")[1].id", "input2");
|
|
shouldBeEqualToString("document.querySelectorAll(\"input:read-write\")[2].id", "input3");
|
|
shouldBeEqualToString("document.querySelectorAll(\"input:read-write\")[3].id", "input5");
|
|
|
|
shouldBe("document.querySelectorAll(\"input:read-only\").length", "2");
|
|
shouldBeEqualToString("document.querySelectorAll(\"input:read-only\")[0].id", "input4");
|
|
shouldBeEqualToString("document.querySelectorAll(\"input:read-only\")[1].id", "input6");
|
|
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input1')).backgroundColor", "rgb(255, 255, 255)");
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input1')).color", "rgb(4, 5, 6)");
|
|
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input2')).backgroundColor", "rgb(255, 255, 255)");
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input2')).color", "rgb(4, 5, 6)");
|
|
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input3')).backgroundColor", "rgb(255, 255, 255)");
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input3')).color", "rgb(4, 5, 6)");
|
|
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input4')).backgroundColor", "rgb(1, 2, 3)");
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input4')).color", "rgb(0, 0, 0)");
|
|
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input5')).backgroundColor", "rgb(255, 255, 255)");
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input5')).color", "rgb(4, 5, 6)");
|
|
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input6')).backgroundColor", "rgb(1, 2, 3)");
|
|
shouldBeEqualToString("getComputedStyle(document.getElementById('input6')).color", "rgb(0, 0, 0)");
|
|
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</html>
|