| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../resources/js-test.js"></script> |
| <script src="../resources/common.js"></script> |
| <script src="../resources/picker-common.js"></script> |
| </head> |
| <body> |
| <select id="menu"> |
| <option selected>foo</option> |
| <option>bar</option> |
| <option hidden>baz</option> |
| <optgroup label="qux"> |
| <option>garply</option> |
| </optgroup> |
| </select> |
| <script> |
| var menuElement = document.getElementById('menu'); |
| var picker; |
| |
| function openPickerErrorCallback() { |
| testFailed('picker didn\'t open') |
| finishJSTest(); |
| } |
| openPicker(menu, test1, openPickerErrorCallback); |
| |
| function test1() { |
| picker = internals.pagePopupWindow.global.picker; |
| |
| function onUpdate() { |
| setTimeout(function() { |
| shouldBeEqualToString('picker._selectElement.style.color', 'rgb(123, 0, 0)'); |
| shouldBeEqualToString('picker._selectElement.options[0].style.color', ''); |
| picker.removeListener("didUpdate", onUpdate); |
| test2(); |
| }); |
| } |
| picker.on("didUpdate", onUpdate); |
| menuElement.style.color = 'rgb(123, 0, 0)'; |
| } |
| |
| function test2() { |
| hoverOverElement(picker._selectElement.children[0]); |
| shouldBeEqualToString('picker._selectElement.value', '0'); |
| eventSender.keyDown('ArrowDown'); |
| shouldBeEqualToString('picker._selectElement.value', '1'); |
| |
| picker.on("didUpdate", onUpdate); |
| menuElement.innerHTML = '<option>FOO</option><option>BAR</option><optgroup label="BAZ"></optgroup>'; |
| |
| function onUpdate() { |
| setTimeout(function() { |
| shouldBeEqualToString('picker._selectElement.value', '1'); |
| shouldBe('picker._selectElement.options.length', '2'); |
| shouldBeEqualToString('picker._selectElement.children[0].label', 'FOO'); |
| shouldBeEqualToString('picker._selectElement.children[1].label', 'BAR'); |
| shouldBeEqualToString('picker._selectElement.children[2].tagName', 'OPTGROUP'); |
| shouldBeEqualToString('picker._selectElement.children[2].label', 'BAZ'); |
| picker.removeListener("didUpdate", onUpdate); |
| test3(); |
| }, 0); |
| }; |
| } |
| |
| function test3() { |
| hoverOverElement(picker._selectElement.children[2]); |
| shouldBeEqualToString('picker._selectElement.value', '1'); |
| |
| menuElement.innerHTML = '<option>FOO</option><option>BAR</option><option selected>QUX</option>'; |
| |
| picker.on("didUpdate", function () { |
| setTimeout(function () { |
| shouldBeEqualToString('picker._selectElement.value', '2'); |
| finishJSTest(); |
| }, 0); |
| }); |
| } |
| </script> |
| </body> |
| </html> |
