aom-computed-accessible-node.html | Explore in Territory

<!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/

-->

<!-- Use lang to keep the button in the tree, even when it becomes hidden -->
<div id="button1" role="button" lang="en-US">Click</div>

<script>

test(function(t) {
    assert_true(internals.runtimeFlags.accessibilityObjectModelEnabled);
}, "Make sure that Accessibility Object Model is enabled");

promise_test(async t => {
    const element = document.getElementById("button1");
    let computedAXNode = await getComputedAccessibleNode(element);
    assert_true(computedAXNode != null);
}, 'Ensure that a non null value is returned from getComputedAccessibleNode');

promise_test(async t => {
    const element = document.getElementById("button1");
    let computedAXNode1 = await getComputedAccessibleNode(element);
    let computedAXNode2 = await getComputedAccessibleNode(element);
    assert_true(computedAXNode1 === computedAXNode2);
}, "Multiple calls to getComputedAccessibleNode will return the same node.");
</script>

<div id="button2" role="button" aria-label="axButton">Click</div>

<script>

promise_test(async t => {
    var button1 = document.getElementById("button1");
    let button1CAXNode = await getComputedAccessibleNode(button1);

    assert_equals(button1CAXNode.name, "Click");
    assert_equals(button1CAXNode.role, "button");

    button1.style.display = "none";

    var button2 = document.getElementById("button2");
    let button2CAXNode = await getComputedAccessibleNode(button2);
    assert_equals(button2CAXNode.name, "axButton");
    assert_equals(button2CAXNode.role, "button");

    // As button1 still has a node in the accessibility tree, but its layout has
    // been removed,and therefore the name is now null.
    assert_equals(button1CAXNode.name, null);
    assert_equals(button1CAXNode.role, "button");

}, "Deleting layout from the accessibility tree will not cause a crash.");

</script>

<div id="radio1" role="radio">Radio 1</div>
<div id="radio2" role="radio">Radio 2</div>

<script>

promise_test(async function(test) {
    var radio1 = document.getElementById("radio1");
    var caxNode1 = await window.getComputedAccessibleNode(radio1);
    var radio2 = document.getElementById("radio2");
    var caxNode2 = await window.getComputedAccessibleNode(radio2);
    radio1.innerHTML = "pizza";
    radio2.innerHTML = "tacos";

    // ComputedAccessibleNode for this element has not been updated so should
    // only reflect the name at the time of its request.
    assert_equals(caxNode1.name, "Radio 1");
    assert_equals(caxNode2.name, "Radio 2");

    // Manually refresh the node and check that all references to
    // ComputedAccessibleNodes have been updated.
    await caxNode1.ensureUpToDate();
    assert_equals(caxNode1.name, "pizza");
    assert_equals(caxNode2.name, "tacos");

    radio1.setAttribute("aria-label", "pasta");
    assert_equals(caxNode1.name, "pizza");

    await caxNode1.ensureUpToDate();
    assert_equals(caxNode1.name, "pasta");
}, "ComputedAccessibleNode.ensureUpToDate");



</script>
chromium/third_party/blink/web_tests/accessibility/aom-computed-accessible-node.html
