| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| |
| <select id="select"> |
| <option id="option1">1</option> |
| <option id="option2">2</option> |
| <option id="option3">2</option> |
| </select> |
| |
| <script> |
| function axElementById(id) { |
| return accessibilityController.accessibleElementById(id); |
| } |
| |
| async_test(t => { |
| let select = document.querySelector('select'); |
| select.addEventListener("change", t.step_func(e => { |
| assert_equals(e.target.value, "2", "`change` event must fire for '2' on the select element"); |
| t.done(); |
| })); |
| |
| // Press on the select to show the popup. |
| let axSelect = axElementById('select'); |
| select.focus(); |
| axSelect.press(); |
| |
| requestAnimationFrame(t.step_func(() => { |
| // Once the popup is shown, click on another option, which must fire the event |
| let axOption2 = axElementById('option2'); |
| axOption2.press(); |
| t.step_timeout(t.unreached_func("`change` event never fired"), 100); |
| })); |
| }, 'When performing a click through a11y on an option in a select popup, the change event must fire'); |
| </script> |