<!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/master/explainer.md
Spec: https://wicg.github.io/aom/spec/

-->

<div id="aria-atomic" aria-live="polite" aria-atomic="true">POD</div>
<div id="alert-atomic" role="alert">Achtung!</div>

<script>

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

promise_test(async function(t) {
    // atomic attribute is implicitly set for role=alert.
    var divElement = document.getElementById("aria-atomic");
    var alertElement = document.getElementById("alert-atomic");
    var divCaxNode = await window.getComputedAccessibleNode(divElement);
    var alertCaxNode = await window.getComputedAccessibleNode(alertElement);
    assert_equals(divCaxNode.atomic, true);
    assert_equals(alertCaxNode.atomic, true);
}, "ComputedAccessibleNode.atomic.");

</script>

<button id="disabled-native" disabled>Can't click me.</button>
<div id="aria-disabled" aria-disabled="true">Nor me.</div>

<script>

promise_test(async function(t) {
  var buttonElement = document.getElementById("disabled-native");
  var divElement = document.getElementById("aria-disabled");
  var buttonCaxNode = await window.getComputedAccessibleNode(buttonElement);
  var divCaxNode = await window.getComputedAccessibleNode(divElement);
  assert_equals(buttonCaxNode.disabled, true);
  assert_equals(divCaxNode.disabled, true);
}, "ComputedAccessibleNode.disabled");

</script>

<form action="/action_page.php">
  <input id="native-readonly" type="text" name="country" value="Norway" readonly><br>
  <div id="aria-readonly" role="checkbox" aria-checked="true" aria-readonly="true"></div>
  <input id="submit" type="submit" value="Submit">
</form>

<script>

promise_test(async function(t) {
  var readOnlyElement = document.getElementById("native-readonly");
  var ariaReadOnlyElement = document.getElementById("aria-readonly");
  var submitElement = document.getElementById("submit");
  var readOnlyCaxNode = await window.getComputedAccessibleNode(readOnlyElement);
  var ariaReadOnlyCaxNode = await window.getComputedAccessibleNode(ariaReadOnlyElement);
  var submitCaxNode = await window.getComputedAccessibleNode(submitElement);

  assert_equals(readOnlyCaxNode.readOnly, true);
  assert_equals(ariaReadOnlyCaxNode.readOnly, true);
  assert_equals(submitCaxNode.readOnly, false);
}, "ComputedAccessibleNode.readOnly");

</script>

<form>
  <input id="native-required" type="text" required><br>
  <div id="aria-required" type="text" aria-required="true"></div>
  <div id="optional" type="text" aria-required="false"></div>
</form>

<script>

promise_test(async function(t) {
  var nativeRequired = document.getElementById("native-required");
  var ariaRequired = document.getElementById("aria-required");
  var optional = document.getElementById("optional");
  var nativeCaxNode = await window.getComputedAccessibleNode(nativeRequired);
  var ariaCaxNode = await window.getComputedAccessibleNode(ariaRequired);
  var optionalCaxNode = await window.getComputedAccessibleNode(optional);

  assert_equals(nativeCaxNode.required, true);
  assert_equals(ariaCaxNode.required, true);
  assert_equals(optionalCaxNode.required, false);
}, "ComputedAccessibleNode.required");

</script>