blob: 8278a062f4142783d9d315a44f7f313edefda6a0 [file] [log] [blame]
<!DOCTYPE HTML>
<script src="../resources/gc.js"></script>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<!--
Accessibility Object Model
Explainer: https://github.com/WICG/aom/blob/gh-pages/explainer.md
Spec: https://wicg.github.io/aom/spec/
-->
<script>
test(function(t) {
assert_true(internals.runtimeFlags.accessibilityObjectModelEnabled);
}, "Make sure that Accessibility Object Model is enabled");
</script>
<div role="listbox" id="listbox" tabindex=0>
<div role="option" id="option1">Option 1</div>
<div role="option" id="option2">Option 2</div>
<div role="option" id="option3">Option 3</div>
</div>
<script>
test(function(t) {
var listbox = document.getElementById("listbox");
var option1 = document.getElementById("option1");
listbox.focus();
var axListbox = accessibilityController.accessibleElementById("listbox");
var axOption1 = accessibilityController.accessibleElementById("option1");
assert_false(axOption1.isSelected);
assert_equals(axListbox.ariaActiveDescendantElement(), undefined);
listbox.accessibleNode.activeDescendant = option1.accessibleNode;
assert_true(axListbox.ariaActiveDescendantElement().isEqual(axOption1));
// Active Descendant also makes the option selected.
assert_true(axOption1.isSelected);
}, "AccessibleNode.activeDescendant");
</script>
<input id="input1">
<div id="details">Details</div>
<script>
test(function(t) {
var input1 = document.getElementById("input1");
var details = document.getElementById("details");
var axInput1 = accessibilityController.accessibleElementById("input1");
var axDetails = accessibilityController.accessibleElementById("details");
assert_equals(axInput1.ariaDetailsElement(), undefined);
input1.accessibleNode.details = details.accessibleNode;
assert_true(axInput1.ariaDetailsElement().isEqual(axDetails));
}, "AccessibleNode.details");
</script>
<input id="input2">
<div id="errorMessage">ErrorMessage</div>
<script>
test(function(t) {
var input2 = document.getElementById("input2");
var errorMessage = document.getElementById("errorMessage");
var axInput2 = accessibilityController.accessibleElementById("input2");
var axErrorMessage = accessibilityController.accessibleElementById("errorMessage");
assert_equals(axInput2.ariaErrorMessageElement(), undefined);
input2.accessibleNode.errorMessage = errorMessage.accessibleNode;
assert_true(axInput2.ariaErrorMessageElement().isEqual(axErrorMessage));
}, "AccessibleNode.errorMessage");
</script>