OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <meta charset=utf-8> |
| 3 <title>Selector: pseudo-classes (:in-range, :out-of-range)</title> |
| 4 <link rel="author" title="Denis Ah-Kang" href="mailto:denis@w3.org" id=link1> |
| 5 <link rel=help href="https://html.spec.whatwg.org/multipage/#pseudo-classes" id=
link2> |
| 6 <script src="../../../../../../resources/testharness.js"></script> |
| 7 <script src="../../../../../../resources/testharnessreport.js"></script> |
| 8 <script src="utils.js"></script> |
| 9 <div id="log"></div> |
| 10 <input type=number value=0 min=0 max=10 id=number1> |
| 11 <input type=number value=0 min=0 max=10 id=number2 disabled> |
| 12 <input type=number value=0 min=1 max=10 id=number3> |
| 13 <input type=number value=11 min=0 max=10 id=number4> |
| 14 |
| 15 <script> |
| 16 testSelector(":in-range", ["number1"], "':in-range' matches all elements that
are candidates for constraint validation, have range limitations, and that are n
either suffering from an underflow nor suffering from an overflow"); |
| 17 |
| 18 testSelector(":out-of-range", ["number3", "number4"], "':out-of-range' matches
all elements that are candidates for constraint validation, have range limitati
ons, and that are either suffering from an underflow or suffering from an overfl
ow"); |
| 19 |
| 20 document.getElementById("number1").value = -10; |
| 21 testSelector(":in-range", [], "':in-range' update number1's value < min"); |
| 22 testSelector(":out-of-range", ["number1", "number3", "number4"], "':out-of-ran
ge' update number1's value < min"); |
| 23 |
| 24 document.getElementById("number3").min = 0; |
| 25 testSelector(":in-range", ["number3"], "':in-range' update number3's min < val
ue"); |
| 26 testSelector(":out-of-range", ["number1", "number4"], "':out-of-range' update
number3's min < value"); |
| 27 </script> |
OLD | NEW |