| <!DOCTYPE HTML> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| |
| <style> |
| .hideAllContainers .container { |
| display: none; |
| } |
| </style> |
| |
| <div class="container"> |
| <button id="button1"></button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton1 = accessibilityController.accessibleElementById("button1"); |
| assert_equals(axButton1.name, ""); |
| }, "Button with no content"); |
| </script> |
| |
| <div class="container"> |
| <button id="button2">button2-content</button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton2 = accessibilityController.accessibleElementById("button2"); |
| assert_equals(axButton2.name, "button2-content"); |
| assert_equals(axButton2.nameFrom, "contents"); |
| }, "Button with text content"); |
| </script> |
| |
| <div class="container"> |
| <button id="button3"><img src="resources/cake.png"></button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton3 = accessibilityController.accessibleElementById("button3"); |
| assert_equals(axButton3.name, ""); |
| }, "Button with img content with no alt"); |
| </script> |
| |
| <div class="container"> |
| <button id="button4"><img src="resources/cake.png" alt="cake"></button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton4 = accessibilityController.accessibleElementById("button4"); |
| assert_equals(axButton4.name, "cake"); |
| assert_equals(axButton4.nameFrom, "contents"); |
| }, "Button with img content with alt"); |
| </script> |
| |
| <div class="container"> |
| <button id="button5">I love <img src="resources/cake.png">!</button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton5 = accessibilityController.accessibleElementById("button5"); |
| assert_equals(axButton5.name, "I love !"); |
| assert_equals(axButton5.nameFrom, "contents"); |
| }, "Button with text content and img content with no alt"); |
| </script> |
| |
| <div class="container"> |
| <button id="button6">I love <img src="resources/cake.png" alt="cake">!</button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton6 = accessibilityController.accessibleElementById("button6"); |
| assert_equals(axButton6.name, "I love cake!"); |
| assert_equals(axButton6.nameFrom, "contents"); |
| }, "Button with text content and img content with alt"); |
| </script> |
| |
| <div class="container"> |
| <button id="button7" title="button7-title"></button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton7 = accessibilityController.accessibleElementById("button7"); |
| assert_equals(axButton7.name, "button7-title"); |
| assert_equals(axButton7.nameFrom, "title"); |
| }, "Button with title only"); |
| </script> |
| |
| <div class="container"> |
| <button id="button8" title="button8-title">button8-content</button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton8 = accessibilityController.accessibleElementById("button8"); |
| assert_equals(axButton8.name, "button8-content"); |
| assert_equals(axButton8.nameFrom, "contents"); |
| }, "Button with title and contents"); |
| </script> |
| |
| <div class="container"> |
| <button id="button9" title="button9-title"><img src="resources/cake.png"></button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton9 = accessibilityController.accessibleElementById("button9"); |
| assert_equals(axButton9.name, "button9-title"); |
| assert_equals(axButton9.nameFrom, "title"); |
| }, "Button with title and img content with no alt"); |
| </script> |
| |
| <div class="container"> |
| <button id="button10" title="button10-title"><img src="resources/cake.png" alt="cake"></button> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton10 = accessibilityController.accessibleElementById("button10"); |
| assert_equals(axButton10.name, "cake"); |
| assert_equals(axButton10.nameFrom, "contents"); |
| }, "Button with title and img content with alt"); |
| </script> |
| |
| <div class="container"> |
| <button id="button11">button11-content</button> |
| <label for="button11">label-for-button11</label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axButton11 = accessibilityController.accessibleElementById("button11"); |
| assert_equals(axButton11.name, "label-for-button11"); |
| assert_equals(axButton11.nameFrom, "relatedElement"); |
| }, "Button with text content and label"); |
| </script> |
| |
| |
| <script> |
| if (window.testRunner) |
| document.body.className = "hideAllContainers"; |
| </script> |