<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<select id="select" size="0">
<option id="option1">Apple</option>
<option id="option2">Orange</option>
<option id="option3">Banana</option>
</select>
<script>
function axElementById(id) {
return accessibilityController.accessibleElementById(id);
}
test(() => {
var select = document.querySelector('select');
select.focus();
select.selectedIndex = 0;
var axSelect = axElementById('select');
var axOption1 = axElementById('option1');
assert_true(axSelect.isFocused);
assert_equals(axSelect.activeDescendant, undefined);
assert_true(axOption1.isFocusable);
assert_true(axOption1.isSelected);
assert_equals(axSelect.childrenCount, 1);
var axMenuListPopup = axSelect.childAtIndex(0);
assert_equals(axMenuListPopup.role, 'AXRole: AXMenuListPopup');
assert_equals(axMenuListPopup.activeDescendant, axOption1);
}, 'An active descendant should be exposed on the menu list popup when an option is selected and the select element is focused.');
test(() => {
var select = document.querySelector('select');
select.blur();
select.selectedIndex = 1;
var axSelect = axElementById('select');
var axOption2 = axElementById('option2');
assert_false(axSelect.isFocused);
assert_equals(axSelect.activeDescendant, undefined);
assert_true(axOption2.isFocusable);
assert_true(axOption2.isSelected);
assert_equals(axSelect.childrenCount, 1);
var axMenuListPopup = axSelect.childAtIndex(0);
assert_equals(axMenuListPopup.role, 'AXRole: AXMenuListPopup');
}, 'An active descendant should not be exposed on the menu list popup when the select element is not focused.');
</script>