| <!DOCTYPE HTML> |
| <script src='../../../resources/js-test.js'></script> |
| <script src='../resources/common.js'></script> |
| <script>description('Option Groups with display: none should not show the children option elements');</script> |
| |
| <select> |
| <option>One</option> |
| <option>Two</option> |
| <option>Three</option> |
| <optgroup label='Four-Five' style='display: none'> |
| <option>Four</option> |
| <option>Five</option> |
| </optgroup> |
| <option>Six</option> |
| <option>Seven</option> |
| </select> |
| |
| <select> |
| <option>One</option> |
| <option>Two</option> |
| <option>Three</option> |
| <optgroup label='Four-Five'> |
| <option>Four</option> |
| <option>Five</option> |
| </optgroup> |
| <option>Six</option> |
| <option>Seven</option> |
| </select> |
| |
| <script> |
| |
| if (window.eventSender) { |
| |
| var optgrp = document.querySelectorAll('optgroup'); |
| var select = document.querySelectorAll('select'); |
| |
| select[1].focus(); |
| eventSender.keyDown('ArrowDown'); |
| eventSender.keyDown('ArrowDown'); |
| eventSender.keyDown('ArrowDown'); |
| shouldBeEqualToString('select[1].value', 'Four'); |
| |
| |
| optgrp[1].style.display = 'none'; |
| eventSender.keyDown('O'); |
| eventSender.keyDown('ArrowDown'); |
| eventSender.keyDown('ArrowDown'); |
| eventSender.keyDown('ArrowDown'); |
| shouldBeEqualToString('select[1].value', 'Six'); |
| |
| select[0].focus(); |
| eventSender.keyDown('ArrowDown'); |
| eventSender.keyDown('ArrowDown'); |
| eventSender.keyDown('ArrowDown'); |
| shouldBeEqualToString('select[0].value', 'Six'); |
| } |
| |
| </script> |
