| <html> |
| <head> |
| <script src="../../../resources/js-test.js"></script> |
| <script> |
| var selectElement; |
| function go() { |
| // <select multiple="true"> should not have a selection by default. |
| selectElement = document.getElementsByTagName('select')[0]; |
| shouldBe("selectElement.selectedIndex", "-1"); |
| |
| // Do not preserve non-selected state on conversion to single. |
| selectElement.multiple = false; |
| shouldBe("selectElement.selectedIndex", "0"); |
| |
| // <select multiple="false"> should have a selection by default and that |
| // selection should be preserved. |
| selectElement = document.getElementsByTagName('select')[1]; |
| selectElement.multiple = true; |
| shouldBe("selectElement.selectedIndex", "0"); |
| |
| // Test the same cases as above but with selects that start out with |
| // display: none. |
| selectElement = document.getElementsByTagName('select')[2]; |
| selectElement.style.display = ''; |
| shouldBe("selectElement.selectedIndex", "-1"); |
| selectElement.multiple = false; |
| shouldBe("selectElement.selectedIndex", "0"); |
| |
| selectElement = document.getElementsByTagName('select')[3]; |
| selectElement.style.display = ''; |
| selectElement.multiple = true; |
| shouldBe("selectElement.selectedIndex", "0"); |
| |
| // Test resetting the multiple attribute. |
| selectElement = document.getElementsByTagName('select')[4]; |
| shouldBe("selectElement.options[0].selected", "true"); |
| shouldBe("selectElement.options[1].selected", "true"); |
| shouldBe("selectElement.options[2].selected", "false"); |
| selectElement.multiple = true; |
| shouldBe("selectElement.options[0].selected", "true"); |
| shouldBe("selectElement.options[1].selected", "true"); |
| shouldBe("selectElement.options[2].selected", "false"); |
| selectElement.multiple = false; |
| shouldBe("selectElement.options[0].selected", "true"); |
| shouldBe("selectElement.options[1].selected", "false"); |
| shouldBe("selectElement.options[2].selected", "false"); |
| } |
| </script> |
| <body onload="go()"> |
| <select multiple="true"> |
| <option id="opt1" value="1">1</option> |
| <option id="opt2" value="2">2</option> |
| <option id="opt2" value="3">3</option> |
| </select> |
| <select> |
| <option id="opt1" value="1">1</option> |
| <option id="opt2" value="2">2</option> |
| <option id="opt2" value="3">3</option> |
| </select> |
| <select multiple="true" style="display: none;"> |
| <option id="opt1" value="1">1</option> |
| <option id="opt2" value="2">2</option> |
| <option id="opt2" value="3">3</option> |
| </select> |
| <select style="display: none;"> |
| <option id="opt1" value="1">1</option> |
| <option id="opt2" value="2">2</option> |
| <option id="opt2" value="3">3</option> |
| </select> |
| <select multiple="true"> |
| <option id="opt1" value="1" selected="selected">1</option> |
| <option id="opt2" value="2" selected="selected">2</option> |
| <option id="opt2" value="3">3</option> |
| </select> |
| <div id="console"></div> |
| </body> |
| </html> |
