| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <!-- Start with --> |
| <div role="main"> |
| <input id="comboBox" |
| role="combobox" |
| type="search" |
| autofocus |
| aria-autocomplete="list" |
| aria-expanded="true" |
| aria-haspopup="true" |
| aria-activedescendant="state2" |
| aria-controls="stateList"> |
| <div id="container"/> |
| </div> |
| |
| <script> |
| async_test((t) => { |
| let comboBox = accessibilityController.accessibleElementById('comboBox'); |
| document.getElementById('container').innerHTML = |
| '<ul id="stateList" role="listbox"><li id="state1" role="option">Alabama</li><li id="state2" role="option">Alaska</li></ul>'; |
| document.body.offsetTop; |
| t.step_timeout(() => { |
| assert_true(comboBox.isFocused, 'Combo box should be focused.'); |
| let state1 = accessibilityController.accessibleElementById('state1'); |
| assert_false(state1.isSelected, 'State1 should not be selected.'); |
| assert_true(state1.isFocusable, 'State1 should be focusable.'); |
| assert_false(state1.isFocused, 'State1 should not be focused.'); |
| |
| let state2 = accessibilityController.accessibleElementById('state2'); |
| assert_equals(comboBox.activeDescendant, state2, 'State2 should be the active descendant.'); |
| assert_true(state2.isSelected, 'State2 should be selected.'); |
| assert_true(state2.isFocusable, 'State2 should be focusable.'); |
| assert_false(state2.isFocused, 'State2 should not be focused.'); |
| |
| t.done(); |
| }, 0); |
| }, 'An option with an activedescendant pointing to it is selected.'); |
| </script> |
