| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <p id="description"></p> |
| <div id="console"></div> |
| |
| <div id="test" style="display:none;"></div> |
| |
| <script> |
| description('Test for the datalist element.'); |
| |
| var testElement = document.getElementById("test"); |
| |
| function createForm(id) { |
| var form = document.createElement("form"); |
| form.id = id; |
| testElement.appendChild(form); |
| return form; |
| }; |
| |
| function createInput(form) { |
| var input = document.createElement("input"); |
| input.setAttribute("form", form); |
| testElement.appendChild(input); |
| return input; |
| }; |
| |
| function test1() { |
| debug("Test 1: Insert new input after form."); |
| form = createForm("test1"); |
| input = createInput("test1"); |
| shouldBe('form.elements.length', '1'); |
| shouldBe('form.elements[0]', 'input'); |
| }; |
| |
| function test2() { |
| debug("Test 2: Insert two forms with same id."); |
| input = createInput("test2"); |
| form1 = createForm("test2"); |
| form2 = createForm("test2"); |
| shouldBe('form1.elements.length', '1'); |
| shouldBe('form2.elements.length', '0'); |
| shouldBe('form1.elements[0]', 'input'); |
| }; |
| |
| function test3() { |
| debug("Test 3: Change form id."); |
| form = createForm("test3-1"); |
| input = createInput("test3-2"); |
| form.id = "test3-2"; |
| shouldBe('form.elements.length', '1'); |
| shouldBe('form.elements[0]', 'input'); |
| }; |
| |
| function test4() { |
| debug("Test 4: Order."); |
| input1 = createInput("test4"); |
| input2 = createInput("test4"); |
| form = createForm("test4"); |
| input3 = document.createElement("input"); |
| form.appendChild(input3); |
| input4 = createInput("test4"); |
| input5 = createInput("test4"); |
| |
| shouldBe('form.elements.length', '5'); |
| shouldBe('form.elements[0]', 'input1'); |
| shouldBe('form.elements[1]', 'input2'); |
| shouldBe('form.elements[2]', 'input3'); |
| shouldBe('form.elements[3]', 'input4'); |
| shouldBe('form.elements[4]', 'input5'); |
| |
| input2.setAttribute("form", ""); |
| shouldBe('form.elements.length', '4'); |
| shouldBe('form.elements[0]', 'input1'); |
| shouldBe('form.elements[1]', 'input3'); |
| shouldBe('form.elements[2]', 'input4'); |
| shouldBe('form.elements[3]', 'input5'); |
| }; |
| |
| function test5() { |
| debug("Test 5: Add new element with form attribute to the form."); |
| form = document.createElement("form"); |
| form.id = "test5"; |
| form.innerHTML = "<textarea id=\"test5-input1\"></textarea><input form=test5 id=\"test5-input2\"><select id=\"test5-input3\">"; |
| test.appendChild(form); |
| input1 = document.getElementById("test5-input1"); |
| input2 = document.getElementById("test5-input2"); |
| input3 = document.getElementById("test5-input3"); |
| shouldBe('form.elements.length', '3'); |
| shouldBe('form.elements[0]', 'input1'); |
| shouldBe('form.elements[1]', 'input2'); |
| shouldBe('form.elements[2]', 'input3'); |
| }; |
| |
| test1(); |
| test2(); |
| test3(); |
| test4(); |
| test5(); |
| |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
