66 lines
3.0 KiB
HTML
66 lines
3.0 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<body>
|
|
<script src="../resources/js-test-pre.js"></script>
|
|
|
|
<!-- implicit level of tag -->
|
|
<h1 class="ex" data-expected="1">X</h1>
|
|
<h2 class="ex" data-expected="2">X</h2>
|
|
<h3 class="ex" data-expected="3">X</h3>
|
|
<h4 class="ex" data-expected="4">X</h4>
|
|
<h5 class="ex" data-expected="5">X</h5>
|
|
<h6 class="ex" data-expected="6">X</h6>
|
|
|
|
<!-- explicit aria-level overrides on h1-h6 (withOUT explicit heading role declaration) -->
|
|
<h6 class="ex" data-expected="1" aria-level="1">X</h6>
|
|
<h5 class="ex" data-expected="2" aria-level="2">X</h5>
|
|
<h4 class="ex" data-expected="3" aria-level="3">X</h4>
|
|
<h3 class="ex" data-expected="4" aria-level="4">X</h3>
|
|
<h2 class="ex" data-expected="5" aria-level="5">X</h2>
|
|
<h1 class="ex" data-expected="6" aria-level="6">X</h1>
|
|
|
|
<!-- explicit aria-level overrides on h1-h6 (with explicit heading role declaration) -->
|
|
<h6 class="ex" role="heading" data-expected="1" aria-level="1">X</h6>
|
|
<h5 class="ex" role="heading" data-expected="2" aria-level="2">X</h5>
|
|
<h4 class="ex" role="heading" data-expected="3" aria-level="3">X</h4>
|
|
<h3 class="ex" role="heading" data-expected="4" aria-level="4">X</h3>
|
|
<h2 class="ex" role="heading" data-expected="5" aria-level="5">X</h2>
|
|
<h1 class="ex" role="heading" data-expected="6" aria-level="6">X</h1>
|
|
|
|
<!-- explicit aria-level set on div with explicit heading role declaration -->
|
|
<div class="ex" role="heading" data-expected="1" aria-level="1">X</div>
|
|
<div class="ex" role="heading" data-expected="2" aria-level="2">X</div>
|
|
<div class="ex" role="heading" data-expected="3" aria-level="3">X</div>
|
|
<div class="ex" role="heading" data-expected="4" aria-level="4">X</div>
|
|
<div class="ex" role="heading" data-expected="5" aria-level="5">X</div>
|
|
<div class="ex" role="heading" data-expected="6" aria-level="6">X</div>
|
|
|
|
<!-- implicit level for heading role -->
|
|
<div class="ex" role="heading" data-expected="2">X</div>
|
|
|
|
<!-- todo: h1 elements nested in section elements should inherit nested level. -->
|
|
|
|
<div id="console"></div>
|
|
<script>
|
|
if (window.testRunner && window.accessibilityController) {
|
|
description("This tests that headings have a level matching the implicit default value or explicitly defined aria-level value.")
|
|
var examples = document.querySelectorAll('.ex');
|
|
for (var i = 0, c = examples.length; i < c; i++) {
|
|
var el = examples[i];
|
|
el.id = 'ex' + i;
|
|
var axElement = accessibilityController.accessibleElementById(el.id);
|
|
var result = document.getElementById('console');
|
|
|
|
// Test AXLevel.
|
|
if (axElement.intValue == parseInt(el.getAttribute('data-expected'))) {
|
|
result.innerText += "PASS: level is " + axElement.intValue + ".\n";
|
|
} else {
|
|
result.innerText += "FAIL: level is " + axElement.intValue + " for " + el.outerHTML + ", expected " + parseInt(el.getAttribute('data-expected')) + ".\n";
|
|
}
|
|
el.style.display = 'none'; // Hide each example after verification.
|
|
}
|
|
}
|
|
</script>
|
|
<script src="../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html> |