OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <meta charset=utf-8> |
| 3 <title>input type reset</title> |
| 4 <link rel="author" title="Denis Ah-Kang" href="mailto:denis@w3.org"> |
| 5 <link rel=help href="https://html.spec.whatwg.org/multipage/#reset-button-state-
(type=reset)"> |
| 6 <script src="../../../../../../resources/testharness.js"></script> |
| 7 <script src="../../../../../../resources/testharnessreport.js"></script> |
| 8 <div id="log"></div> |
| 9 <form> |
| 10 <input type=text id=input1 value="foobar"> |
| 11 <input type=text id=input2> |
| 12 <input type=reset id=r1> |
| 13 </form> |
| 14 |
| 15 <input type=text id=input3 value="barfoo"> |
| 16 |
| 17 <table> |
| 18 <form> |
| 19 <tr> |
| 20 <td> |
| 21 <input type=text id=input4 value="foobar"> |
| 22 <input type=reset id=r2> |
| 23 </td> |
| 24 </tr> |
| 25 </form> |
| 26 </table> |
| 27 |
| 28 <div> |
| 29 <form> |
| 30 <input type=text id=input5 value="foobar"> |
| 31 </div> |
| 32 <input type=reset id=r3> |
| 33 </form> |
| 34 |
| 35 <div> |
| 36 <form> |
| 37 <input type=reset id=r4> |
| 38 </div> |
| 39 <input type=text id=input6 value="foobar"> |
| 40 </form> |
| 41 |
| 42 <form id=form5> |
| 43 <input type=reset id=r5> |
| 44 </form> |
| 45 <input form=form5 type=text id=input7 value="foobar"> |
| 46 |
| 47 <form id=form6> |
| 48 <input type=text id=input8 value="foobar"> |
| 49 </form> |
| 50 <input type=reset form=form6 id=r6> |
| 51 |
| 52 <script> |
| 53 var input1 = document.getElementById('input1'), |
| 54 input2 = document.getElementById('input2'), |
| 55 input3 = document.getElementById('input3'), |
| 56 input7 = document.getElementById('input7'), |
| 57 input8 = document.getElementById('input8'), |
| 58 r1 = document.getElementById('r1'); |
| 59 |
| 60 test(function(){ |
| 61 assert_equals(input1.value, "foobar"); |
| 62 assert_equals(input2.value, ""); |
| 63 assert_equals(input3.value, "barfoo"); |
| 64 input1.value = "foobar1"; |
| 65 input2.value = "notempty"; |
| 66 input3.value = "barfoo1"; |
| 67 assert_equals(input1.value, "foobar1"); |
| 68 assert_equals(input2.value, "notempty"); |
| 69 assert_equals(input3.value, "barfoo1"); |
| 70 r1.click(); |
| 71 assert_equals(input1.value, "foobar"); |
| 72 assert_equals(input2.value, ""); |
| 73 assert_equals(input3.value, "barfoo1"); |
| 74 }, "reset button only resets the form owner"); |
| 75 |
| 76 test(function(){ |
| 77 assert_false(r1.willValidate); |
| 78 }, "the element is barred from constraint validation"); |
| 79 |
| 80 test(function(){ |
| 81 assert_equals(input1.value, "foobar"); |
| 82 assert_equals(input2.value, ""); |
| 83 assert_equals(input3.value, "barfoo1"); |
| 84 r1.disabled = true; |
| 85 r1.click(); |
| 86 assert_equals(input1.value, "foobar"); |
| 87 assert_equals(input2.value, ""); |
| 88 assert_equals(input3.value, "barfoo1"); |
| 89 }, "clicking on a disabled reset does nothing"); |
| 90 |
| 91 function testReset(inputId, buttonId) { |
| 92 var inp = document.getElementById(inputId); |
| 93 assert_equals(inp.value, "foobar"); |
| 94 inp.value = "barfoo"; |
| 95 assert_equals(inp.value, "barfoo"); |
| 96 document.getElementById(buttonId).click(); |
| 97 assert_equals(inp.value, "foobar"); |
| 98 } |
| 99 |
| 100 test(function(){ |
| 101 testReset("input4", "r2"); |
| 102 testReset("input5", "r3"); |
| 103 testReset("input6", "r4"); |
| 104 }, "reset button resets controls associated with their form using the form ele
ment pointer"); |
| 105 |
| 106 test(function(){ |
| 107 testReset("input7", "r5"); |
| 108 }, "reset button resets controls associated with a form using the form attribu
te"); |
| 109 |
| 110 test(function(){ |
| 111 testReset("input8", "r6"); |
| 112 }, "reset button associated with a form using the form attribute resets all th
e form's controls"); |
| 113 </script> |
OLD | NEW |