diff options
Diffstat (limited to 'dom/html/test/test_bug610687.html')
-rw-r--r-- | dom/html/test/test_bug610687.html | 195 |
1 files changed, 195 insertions, 0 deletions
diff --git a/dom/html/test/test_bug610687.html b/dom/html/test/test_bug610687.html new file mode 100644 index 0000000000..fd6950cce4 --- /dev/null +++ b/dom/html/test/test_bug610687.html @@ -0,0 +1,195 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=610687 +--> +<head> + <title>Test for Bug 610687</title> + <script src="/tests/SimpleTest/SimpleTest.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> +</head> +<body> +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=610687">Mozilla Bug 610687</a> +<p id="display"></p> +<div id="content"> + <form> + <input type='radio' name='a'> + <input type='radio' name='a'> + <input type='radio' name='b'> + </form> + <input type='radio' name='a'> + <input type='radio' name='a'> + <input type='radio' name='b'> +</div> +<pre id="test"> +<script type="application/javascript"> + +/** Test for Bug 610687 **/ + +function checkPseudoClasses(aElement, aValid, aValidUI, aInvalidUI) +{ + if (aValid) { + ok(aElement.matches(":valid"), ":valid should apply"); + } else { + ok(aElement.matches(":invalid"), ":invalid should apply"); + } + + is(aElement.matches(":user-valid"), aValidUI, + aValid ? ":user-valid should apply" : ":user-valid should not apply"); + + is(aElement.matches(":user-invalid"), aInvalidUI, + aInvalidUI ? ":user-invalid should apply" : ":user-invalid should not apply"); + + if (aInvalidUI && (aValid || aValidUI)) { + ok(false, ":invalid can't apply with :valid or :user-valid"); + } +} + +/** + * r1 and r2 should be in the same group. + * r3 should be in another group. + * form can be null. + */ +function checkRadios(r1, r2, r3, form) +{ + // Default state. + checkPseudoClasses(r1, true, false, false); + checkPseudoClasses(r2, true, false, false); + checkPseudoClasses(r3, true, false, false); + + // Suffering from being missing (without ui-invalid). + r1.required = true; + checkPseudoClasses(r1, false, false, false); + checkPseudoClasses(r2, false, false, false); + checkPseudoClasses(r3, true, false, false); + + // Do not suffer from being missing (with ui-valid). + r1.click(); + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, true, false, false); + checkPseudoClasses(r3, true, false, false); + + // Do not suffer from being missing (with ui-valid). + r1.checked = false; + r1.required = false; + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, true, false, false); + checkPseudoClasses(r3, true, false, false); + + // Suffering from being missing (with ui-invalid) with required set on one radio + // and the checked state changed on another. + r1.required = true; + r2.checked = false; + checkPseudoClasses(r1, false, false, true); + checkPseudoClasses(r2, false, false, false); + checkPseudoClasses(r3, true, false, false); + + // Do not suffer from being missing (with ui-valid) by checking the radio which + // hasn't the required attribute. + r2.checked = true; + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, true, false, false); + checkPseudoClasses(r3, true, false, false); + + // .setCustomValidity() should not affect the entire group. + r1.checked = false; r2.checked = false; r3.checked = false; + r1.required = false; + r1.setCustomValidity('foo'); + checkPseudoClasses(r1, false, false, true); + checkPseudoClasses(r2, true, false, false); + checkPseudoClasses(r3, true, false, false); + + r1.setCustomValidity(''); + r2.setCustomValidity('foo'); + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, false, false, false); + checkPseudoClasses(r3, true, false, false); + + r2.setCustomValidity(''); + r3.setCustomValidity('foo'); + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, true, false, false); + checkPseudoClasses(r3, false, false, false); + + // Removing the radio with the required attribute should make the group valid. + r1.setCustomValidity(''); + r2.setCustomValidity(''); + r1.required = false; + r2.required = true; + r1.checked = r2.checked = false; + checkPseudoClasses(r1, false, false, true); + checkPseudoClasses(r2, false, false, false); + + var p = r2.parentNode; + p.removeChild(r2); + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, false, false, false); + + p.appendChild(r2); + checkPseudoClasses(r1, false, false, true); + checkPseudoClasses(r2, false, false, false); + + // Adding a radio element to an invalid group should make it invalid. + p.removeChild(r1); + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, false, false, false); + + p.appendChild(r1); + checkPseudoClasses(r1, false, false, true); + checkPseudoClasses(r2, false, false, false); + + // Adding a checked radio element to an invalid group should make it valid. + p.removeChild(r1); + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, false, false, false); + + r1.checked = true; + p.appendChild(r1); + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, true, false, false); + r1.checked = false; + + // Adding an invalid radio element by changing the name attribute. + r2.name = 'c'; + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, false, false, false); + + r2.name = 'a'; + checkPseudoClasses(r1, false, false, true); + checkPseudoClasses(r2, false, false, false); + + // Adding an element to an invalid radio group by changing the name attribute. + r1.name = 'c'; + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, false, false, false); + + r1.name = 'a'; + checkPseudoClasses(r1, false, false, true); + checkPseudoClasses(r2, false, false, false); + + // Adding a checked element to an invalid radio group with the name attribute. + r1.name = 'c'; + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, false, false, false); + + r1.checked = true; + r1.name = 'a'; + checkPseudoClasses(r1, true, true, false); + checkPseudoClasses(r2, true, false, false); + r1.checked = false; +} + +var r1 = document.getElementsByTagName('input')[0]; +var r2 = document.getElementsByTagName('input')[1]; +var r3 = document.getElementsByTagName('input')[2]; +checkRadios(r1, r2, r3); + +r1 = document.getElementsByTagName('input')[3]; +r2 = document.getElementsByTagName('input')[4]; +r3 = document.getElementsByTagName('input')[5]; +checkRadios(r1, r2, r3); + +</script> +</pre> +</body> +</html> |