| OLD | NEW |
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <meta charset="utf-8"> |
| 3 <title>HTML Test: the HTMLFormControlsCollection interface</title> |
| 4 <link rel="author" title="Intel" href="http://www.intel.com/"> |
| 5 <link rel="help" href="https://html.spec.whatwg.org/multipage/multipage/common-d
om-interfaces.html#htmlformcontrolscollection"> |
| 6 <script src="../../../../../../resources/testharness.js"></script> |
| 7 <script src="../../../../../../resources/testharnessreport.js"></script> |
| 8 <div id="log"></div> |
| 9 <form id="f1"> |
| 10 <input type="radio" id="r1"> |
| 11 <keygen id="kg" name="key"></keygen> |
| 12 </form> |
| 13 <form id="f2"> |
| 14 <table> |
| 15 <tr> |
| 16 <td> |
| 17 <input type="checkbox" id="cb"> |
| 18 <input type="checkbox" name="cb"> |
| 19 </td> |
| 20 </tr> |
| 21 <button id="btn"></button> |
| 22 <button name="btn"></button> |
| 23 </table> |
| 24 </form> |
| 25 |
| 26 <script> |
| 27 |
| 28 var coll1, coll2, rdo; |
| 29 |
| 30 setup(function () { |
| 31 rdo = document.getElementById("r1"); |
| 32 coll1 = document.forms[0].elements; |
| 33 coll2 = document.forms[1].elements; |
| 34 }); |
| 35 |
| 36 //length |
| 37 test(function () { |
| 38 assert_equals(coll1.length, 2, "The length attribute is incorrect."); |
| 39 assert_equals(coll2.length, 4, "The length attribute is incorrect."); |
| 40 }, "The length attribute must return the number of elements in the form"); |
| 41 |
| 42 //getter - index |
| 43 test(function () { |
| 44 assert_equals(coll1.item(0), rdo, "HTMLFormControlsCollection.item(index) shou
ld return the 'input' element in radio status."); |
| 45 }, "HTMLFormControlsCollection.item(index) must return the indexed item"); |
| 46 |
| 47 test(function () { |
| 48 assert_equals(coll1[0], rdo, "HTMLFormControlsCollection[index] should return
the 'input' element in radio status."); |
| 49 }, "HTMLFormControlsCollection[index] must return the indexed item"); |
| 50 |
| 51 //getter - name |
| 52 test(function () { |
| 53 assert_equals(coll1("r1"), rdo, "HTMLFormControlsCollection(name) should retur
n the 'input' element in radio status."); |
| 54 }, "HTMLFormControlsCollection(name) must return the named item"); |
| 55 |
| 56 test(function () { |
| 57 assert_equals(coll1["r1"], rdo, "HTMLFormControlsCollection[name] should retur
n the 'input' element in radio status."); |
| 58 }, "HTMLFormControlsCollection[name] must return the named item"); |
| 59 |
| 60 //getter - namedItem |
| 61 test(function () { |
| 62 assert_equals(coll1.namedItem("r1"), rdo, "HTMLFormControlsCollection.namedIte
m(name) should return the 'input' element in radio status."); |
| 63 }, "HTMLFormControlsCollection.namedItem(name) must return the named item"); |
| 64 |
| 65 test(function () { |
| 66 assert_true(coll1.namedItem("r1") instanceof Element, "Can not return 'Element
' object."); |
| 67 }, "The namedItem(name) must return an Element"); |
| 68 |
| 69 test(function () { |
| 70 assert_true(coll2.namedItem("cb") instanceof RadioNodeList, "Can not return 'R
adioNodeList' object."); |
| 71 }, "The namedItem(name) must return RadioNodeList"); |
| 72 |
| 73 test(function () { |
| 74 assert_equals(coll1.namedItem(""), null, "The return value of namedItem() shou
ld be null."); |
| 75 }, "The namedItem(name) must return null if the name is empty"); |
| 76 |
| 77 test(function () { |
| 78 assert_equals(coll1.namedItem("test"), null, "The return value of namedItem()
should be null."); |
| 79 }, "The namedItem(name) must return null if there is no matched element"); |
| 80 |
| 81 test(function () { |
| 82 assert_equals(coll1.namedItem("kg"), document.getElementById("kg"), "Controls
can be named by 'id' attribute."); |
| 83 assert_equals(coll1.namedItem("key"), document.getElementById("kg"), "Controls
can be named by 'name' attribute."); |
| 84 }, "Controls can be indexed by id or name attribute"); |
| 85 |
| 86 test(function () { |
| 87 assert_equals(coll2.namedItem("btn").length, 2, "The length attribute should b
e 2."); |
| 88 }, "The namedItem(name) must return the items with id or name attribute"); |
| 89 |
| 90 //various controls in fieldset and form |
| 91 var containers = ["form", "fieldset"], |
| 92 controls = ["button", "fieldset", "input", "keygen", "object", "output", "se
lect", "textarea"]; |
| 93 for (var m = 0; m < containers.length; m++) { |
| 94 test(function () { |
| 95 var container = document.createElement(containers[m]); |
| 96 var len = controls.length; |
| 97 for (var n = 0; n < len; n++) |
| 98 container.appendChild(document.createElement(controls[n])); |
| 99 document.body.appendChild(container); |
| 100 assert_equals(container.elements.length, len, "The length should be " + len
+ "."); |
| 101 }, "The HTMLFormControlsCollection interface is used for collections of listed
elements in " + containers[m] + " element"); |
| 102 } |
| 103 |
| 104 //Check the controls' order |
| 105 test(function () { |
| 106 var opt = document.forms[1].insertBefore(document.createElement("output"), doc
ument.forms[1].firstChild); |
| 107 assert_array_equals(document.forms[1].elements, |
| 108 [opt, document.getElementsByTagName("input")[1], document.
getElementsByTagName("input")[2], |
| 109 document.getElementsByTagName("button")[0], document.getEl
ementsByTagName("button")[1]]); |
| 110 }, "The controls in the form element must be sorted in tree order"); |
| 111 |
| 112 </script> |
| OLD | NEW |