blob: d5467d158b175415a234d719cf785a87819e840a [file] [log] [blame]
<!DOCTYPE HTML>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<style>
.hideAllContainers .container {
display: none;
}
</style>
<div class="container">
<img id="img1" src="resources/cake.png">
</div>
<script>
test(function(t) {
var axImg1 = accessibilityController.accessibleElementById("img1");
assert_equals(axImg1.name, "");
}, "img element without alt");
</script>
<div class="container">
<img id="img2" title="img2-title" src="resources/cake.png">
</div>
<script>
test(function(t) {
var axImg2 = accessibilityController.accessibleElementById("img2");
assert_equals(axImg2.name, "img2-title");
assert_equals(axImg2.nameFrom, "attribute");
}, "img element without alt, with title");
</script>
<div class="container">
<img id="img3" title="img3-title" alt="img3-alt" src="resources/cake.png">
</div>
<script>
test(function(t) {
var axImg3 = accessibilityController.accessibleElementById("img3");
assert_equals(axImg3.name, "img3-alt");
assert_equals(axImg3.nameFrom, "attribute");
}, "img element with title and alt");
</script>
<div class="container">
<img id="img4" title="img4-title" alt="img4-alt" aria-label="img4-aria-label" src="resources/cake.png">
</div>
<script>
test(function(t) {
var axImg4 = accessibilityController.accessibleElementById("img4");
assert_equals(axImg4.name, "img4-aria-label");
assert_equals(axImg4.nameFrom, "attribute");
}, "img element with title and alt");
</script>
<div class="container">
<img id="img5" title="img5-title" alt="img5-alt" aria-label="img5-aria-label" aria-labelledby="labelledby5" src="resources/cake.png">
<span hidden="true" id="labelledby5">img5-aria-labelledby</span>
</div>
<script>
test(function(t) {
var axImg5 = accessibilityController.accessibleElementById("img5");
assert_equals(axImg5.name, "img5-aria-labelledby");
assert_equals(axImg5.nameFrom, "relatedElement");
}, "img element with title and alt");
</script>
<script>
if (window.testRunner)
document.body.className = "hideAllContainers";
</script>