blob: feb59ed8e568092e0994ca6eda5b2703c6777ad0 [file] [log] [blame]
<!DOCTYPE HTML>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<style>
.hideAllContainers .container {
display: none;
}
</style>
<div id="link1" class="container" tabIndex=0 role="link">
<p>1</p>
<table role="presentation">
<tr><td>2</td></tr>
<tr><td style="visibility: hidden">3</td></tr>
<tr><td style="display:none">4</td></tr>
<tr style="visibility: hidden"><td>5</td></tr>
<tr style="display: none"><td>6</td></tr>
</table>
<p>7</p>
</div>
<script>
test(function(t) {
var axLink1 = accessibilityController.accessibleElementById("link1");
assert_equals(axLink1.name, "1 2 7");
}, "Visibility: 'hidden' and display: 'none' inside ARIA link");
</script>
<div class="container">
<input id="input2" aria-labelledby="label2">
<div id="label2">
<p>1</p>
<table>
<tr><td>2</td></tr>
<tr><td style="visibility: hidden">3</td></tr>
<tr><td style="display:none">4</td></tr>
<tr style="visibility: hidden"><td>5</td></tr>
<tr style="display: none"><td>6</td></tr>
</table>
<p>7</p>
</div>
</div>
<script>
test(function(t) {
var axInput2 = accessibilityController.accessibleElementById("input2");
assert_equals(axInput2.name, "1 2 7");
}, "Visibility: 'hidden' and display: 'none' inside aria-labelledby label subtree");
</script>
<div class="container">
<input id="input3" aria-labelledby="3a 3b 3c 3d 3e 3f 3g">
<p id="3a">1</p>
<table>
<tr><td id="3b">2</td></tr>
<tr><td id="3c" style="visibility: hidden">3</td></tr>
<tr><td id="3d" style="display:none">4</td></tr>
<tr id="3e" style="visibility: hidden"><td>5</td></tr>
<tr id="3f" style="display: none"><td>6</td></tr>
</table>
<p id="3g">7</p>
</div>
<script>
test(function(t) {
var axInput3 = accessibilityController.accessibleElementById("input3");
assert_equals(axInput3.name, "1 2 3 4 6 7");
}, "Visibility: 'hidden' and display: 'none' referenced directly by aria-labelledby");
</script>
<div class="container">
<input id="input4" aria-labelledby="label4">
<div style="display: none">
<div id="label4">
<p>1</p>
<table>
<tr><td>2</td></tr>
<tr><td style="visibility: hidden">3</td></tr>
<tr><td style="display:none">4</td></tr>
<tr style="visibility: hidden"><td>5</td></tr>
<tr style="display: none"><td>6</td></tr>
</table>
<p>7</p>
</div>
</div>
</div>
<script>
test(function(t) {
var axInput4 = accessibilityController.accessibleElementById("input4");
assert_equals(axInput4.name, " 1 2 7 ");
}, "Visibility: 'hidden' and display: 'none' inside aria-labelledby label subtree, where entire label subtree is display: 'none'");
</script>
<script>
if (window.testRunner)
document.body.className = "hideAllContainers";
</script>