| <!DOCTYPE html> |
| <html> |
| <body> |
| <script src="../../resources/js-test.js"></script> |
| <p id="description"></p> |
| <div id="divId"> |
| <form id="form1"> |
| <button id=button1></button> |
| <fieldset id=fieldset1><legend id=legend1></legend></fieldset> |
| <input id=inputhidden type=hidden> |
| <input id=commoninput type=text> |
| <input id=inputcommon type=search value=searching> |
| <input id=inputCOMMON type=url> |
| <input id=commoninput type=email> |
| <input id=inputpassword type=password> |
| <input id=inputdate type=date> |
| <input id=numberId name=inputcommon type=number value=123> |
| <input id=inputrange type=range> |
| <input id=inputcolor type=color> |
| <input id=inputcheckbox type=checkbox> |
| <input id=inputcommon type=radio value="inputRadioValue"> |
| <input id=inputfile type=file> |
| <input id=inputsubmit type=submit> |
| <input id=inputcommon type=image> |
| <input id=commoninput type=reset> |
| <input id=inputcommon type=button value=buttonValue> |
| <keygen id=keygen1></keygen> |
| <label id=label1></label> |
| <meter id=meter1></meter> |
| <object id=object1></object> |
| <output id=output1></output> |
| <progress id=progress1></progress> |
| <select id=select1 name=inputCOmmon> |
| <optgroup id=optgroup1>group1</optgroup> |
| <option id=option1>option1</option> |
| </select> |
| <textarea id=textarea1></textarea> |
| </form> |
| </div> |
| <div id="console"></div> |
| <script> |
| description("This test is for RadioNodeList specified at http://www.whatwg.org/specs/web-apps/current-work/multipage/common-dom-interfaces.html#radionodelist "); |
| debug(""); |
| var owner = document.getElementById('form1'); |
| |
| shouldBe('owner.elements.length', '23'); |
| |
| var elementsList = owner.elements; |
| var radioNodeList = elementsList.namedItem("inputcommon"); |
| shouldBe('radioNodeList.length', '4'); |
| |
| shouldBe('radioNodeList[0].value', "'searching'"); |
| shouldBe('radioNodeList[1].value', "'123'"); |
| shouldBe('radioNodeList[2].value', "'inputRadioValue'"); |
| shouldBe('radioNodeList[3].value', "'buttonValue'"); |
| |
| debug(""); |
| debug("Changing the input value to check RadioNodeList is live view of FormCollection"); |
| document.getElementById("numberId").value = 456; |
| shouldBe('radioNodeList[1].value', "'456'"); |
| |
| debug(""); |
| debug("Checking value IDL attribute on the RadioNodeList"); |
| shouldBe('radioNodeList.value', '""'); |
| shouldBe('radioNodeList.value = "inputRadioValue"; radioNodeList[2].checked', 'true'); |
| shouldBe('Object.prototype.toString.call(radioNodeList[2])', "'[object HTMLInputElement]'"); |
| shouldBe('radioNodeList[2].type', "'radio'"); |
| |
| radioNodeList[2].checked = false; |
| shouldBe('radioNodeList.value', '""'); |
| shouldBe('radioNodeList[2].checked = true; radioNodeList.value', "'inputRadioValue'"); |
| |
| var newElement = document.createElement("input"); |
| newElement.setAttribute("type", "text"); |
| newElement.setAttribute("value", "new element"); |
| newElement.setAttribute("id", "inputcommon"); |
| |
| debug(""); |
| debug("Check RadioNodeList is updated after adding a new element"); |
| shouldBe('owner.appendChild(newElement); radioNodeList.length', '5'); |
| shouldBe('radioNodeList[4].value', "'new element'"); |
| |
| debug(""); |
| debug("Check RadioNodeList is updated after remove an element"); |
| shouldBe('owner.removeChild(newElement); radioNodeList.length', '4'); |
| shouldBe('radioNodeList[3].value', "'buttonValue'"); |
| |
| var nonSubtreeElement = document.createElement("input"); |
| nonSubtreeElement.setAttribute("type", "text"); |
| nonSubtreeElement.setAttribute("value", "non subtree element"); |
| nonSubtreeElement.setAttribute("id", "inputcommon"); |
| nonSubtreeElement.setAttribute("form", "form1"); |
| |
| var container = document.getElementById("divId"); |
| |
| debug(""); |
| debug("Check RadioNodeList is updated after adding a new element"); |
| shouldBe('container.appendChild(nonSubtreeElement); radioNodeList.length', '5'); |
| shouldBe('owner.elements.length', '24'); |
| shouldBe('radioNodeList[4].value', "'non subtree element'"); |
| |
| debug(""); |
| debug("Check RadioNodeList is updated after change in id, type and checked state of an element"); |
| shouldBe('radioNodeList.length', '5'); |
| debug("After changing the id"); |
| radioNodeList[4].id = "changedName"; |
| shouldBe('radioNodeList.length', '4'); |
| |
| shouldBe('elementsList[13].checked = false; radioNodeList.value', '""'); |
| shouldBe('elementsList[13].checked = true; radioNodeList.value', "'inputRadioValue'"); |
| shouldBe('elementsList[13].type = "date"; radioNodeList.value', "''"); |
| |
| debug(""); |
| debug("Check second RadioNodeList is also created properly"); |
| var radioNodeList2 = elementsList.namedItem("commoninput"); |
| shouldBe('radioNodeList2.length', '3'); |
| |
| shouldBe('radioNodeList2[0].type', "'text'"); |
| shouldBe('radioNodeList2[1].type', "'email'"); |
| shouldBe('radioNodeList2[2].type', "'reset'"); |
| radioNodeList2[2].id = "idChanged"; |
| debug("After changing the id"); |
| shouldBe('radioNodeList2.length', '2'); |
| debug(""); |
| |
| debug("Check that object element also reflects in RadioNodeList."); |
| document.getElementById("object1").id = "inputcommon"; |
| shouldBe('radioNodeList.length', '5'); |
| |
| debug(""); |
| debug("Check that object element does not reflect in RadioNodeList if its owner form is not present."); |
| var nonSubtreeObjectElement = document.createElement("object"); |
| nonSubtreeObjectElement.setAttribute("id", "inputcommon"); |
| shouldBe('container.appendChild(nonSubtreeObjectElement); radioNodeList.length', '5'); |
| |
| container.parentNode.removeChild(container); |
| </script> |
| </body> |
| </html> |
