aom-computed-string-properties.html

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

-->

<div id="button1" role="button">Click</div>

<script>

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

promise_test(async function(test) {
    var element = document.getElementById("button1");
    var computedAXNode = await window.getComputedAccessibleNode(element);
    assert_equals(computedAXNode.role, "button");
}, "ComputedAccessibleNode.role");

promise_test(async function(test) {
    var element = document.getElementById("button1");
    var computedAXNode = await window.getComputedAccessibleNode(element);
    assert_equals(computedAXNode.name, "Click");
}, "ComputedAccessibleNode.name");

</script>

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

<script>

promise_test(async function(test) {
    var element = document.getElementById("button2");
    var computedAXNode = await window.getComputedAccessibleNode(element);
    assert_equals(computedAXNode.name, "axButton");
}, "ComputedAccessibleNode.name set through ARIA.");

</script>

<div id="shortcut" aria-keyshortcuts="Alt+Shift+P">Use my shortcut!</div>

<script>

promise_test(async function(test) {
    var element = document.getElementById("shortcut");
    var computedAXNode = await window.getComputedAccessibleNode(element);
    assert_equals(computedAXNode.keyShortcuts, "Alt+Shift+P");
}, "ComputedAccessibleNode.keyShortcuts.");

</script>

<p><label>Name:<input id="fullname" type="text" name="fullname" placeholder="Jordan Doe"></label></p>

<script>

promise_test(async function(test) {
    var element = document.getElementById("fullname");
    computedAXNode = await window.getComputedAccessibleNode(element);
    assert_equals(computedAXNode.placeholder, "Jordan Doe");
}, "ComputedAccessibleNode.placeHolder.");

</script>

<div id="button3" role="button" aria-roledescription="submit button">Click</div>

<script>

promise_test(async function(test) {
    var element = document.getElementById("button3");
    computedAXNode = await window.getComputedAccessibleNode(element);
    assert_equals(computedAXNode.role, "button");
    assert_equals(computedAXNode.roleDescription, "submit button");
}, "ComputedAccessibleNode.roleDescription.");

</script>

<input id="both-autocomplete" role="combobox" aria-autocomplete="both"></input>
<input id="no-autocomplete" role="combobox" aria-autocomplete="none"></input>
<script>

promise_test(async function(test) {
    var bothElement = document.getElementById("both-autocomplete");
    var noneElement = document.getElementById("no-autocomplete");
    var bothCAXNode = await window.getComputedAccessibleNode(bothElement);
    var noneCAXNode = await window.getComputedAccessibleNode(noneElement);
    assert_equals(bothCAXNode.autocomplete, "both");
    assert_equals(noneCAXNode.autocomplete, null);
    test.done();
}, "ComputedAccessibleNode.autocomplete");

</script>

<div role="checkbox" id="group-checkbox" aria-checked="mixed" aria-controls="cond1 cond2" tabindex="0">
    All condiments
</div>
    <ul id="checkboxes">
      <li>
        <label>
          <input type="checkbox" id="cond1"> Lettuce
        </label>
      </li>
      <li>
        <label>
          <input type="checkbox" id="cond2" checked=""> Tomato
        </label>
      </li>
</ul>

<script>

promise_test(async function(test) {
    var groupElement = document.getElementById("group-checkbox");
    var cond1Element = document.getElementById("cond1");
    var cond2Element = document.getElementById("cond2");

    var groupCaxNode = await window.getComputedAccessibleNode(groupElement);
    var cond1CaxNode = await window.getComputedAccessibleNode(cond1Element);
    var cond2CaxNode = await window.getComputedAccessibleNode(cond2Element);
    assert_equals(groupCaxNode.checked, "mixed");
    assert_equals(cond1CaxNode.checked, "false");
    assert_equals(cond2CaxNode.checked, "true");
}, "ComputedAccessibleNode.checked.");
</script>
chromium/third_party/blink/web_tests/accessibility/aom-computed-string-properties.html
