| <!DOCTYPE HTML> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| |
| <style> |
| .hideAllContainers .container { |
| display: none; |
| } |
| </style> |
| |
| <div class="container"> |
| <input id="text1" type="text"> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput1 = accessibilityController.accessibleElementById("text1"); |
| assert_equals(axTextInput1.name, ""); |
| }, "Text input"); |
| </script> |
| |
| <div class="container"> |
| <input id="text2" type="text" title="text2-title"> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput2 = accessibilityController.accessibleElementById("text2"); |
| assert_equals(axTextInput2.name, "text2-title"); |
| assert_equals(axTextInput2.nameFrom, "title"); |
| }, "Text input with title"); |
| </script> |
| |
| <div class="container"> |
| <input id="text3" type="text" title="text3-title" placeholder="text3-placeholder"> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput3 = accessibilityController.accessibleElementById("text3"); |
| assert_equals(axTextInput3.name, "text3-placeholder"); |
| assert_equals(axTextInput3.nameFrom, "placeholder"); |
| }, "Text input with title and placeholder"); |
| </script> |
| |
| <div class="container"> |
| <input id="text4" type="text" title="text4-title" placeholder="text4-placeholder"> |
| <label for="text4">label-for-text4</label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput4 = accessibilityController.accessibleElementById("text4"); |
| assert_equals(axTextInput4.name, "label-for-text4"); |
| assert_equals(axTextInput4.nameFrom, "relatedElement"); |
| }, "Text input with title, placeholder and label-for"); |
| </script> |
| |
| <div class="container"> |
| <input id="text5" type="text" title="text5-title" placeholder="text5-placeholder" aria-label="text5-aria-label"> |
| <label for="text5">label-for-text5</label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput5 = accessibilityController.accessibleElementById("text5"); |
| assert_equals(axTextInput5.name, "text5-aria-label"); |
| assert_equals(axTextInput5.nameFrom, "attribute"); |
| }, "Text input with title, placeholder, label-for and aria-label"); |
| </script> |
| |
| <div class="container"> |
| <input id="text6" type="text" title="text6-title" placeholder="text6-placeholder" aria-label="text6-aria-label" aria-labelledby="labelledby6"> |
| <label for="text6">label-for-text6</label> |
| <span id="labelledby6">labelledby-for-text6</span> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput6 = accessibilityController.accessibleElementById("text6"); |
| assert_equals(axTextInput6.name, "labelledby-for-text6"); |
| assert_equals(axTextInput6.nameFrom, "relatedElement"); |
| }, "Text input with title, placeholder, label-for, aria-label and aria-labelledby"); |
| </script> |
| |
| <div class="container"> |
| <label>label-wrapping-text7 |
| <input id="text7" type="text" title="text7-title"> |
| </label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput7 = accessibilityController.accessibleElementById("text7"); |
| assert_equals(axTextInput7.name, "label-wrapping-text7 "); |
| assert_equals(axTextInput7.nameFrom, "relatedElement"); |
| }, "Text input with title and label-wrapped"); |
| </script> |
| |
| <div class="container"> |
| <label for="dummy">label-wrapping-text8 |
| <input id="text8" type="text"> |
| </label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput8 = accessibilityController.accessibleElementById("text8"); |
| assert_equals(axTextInput8.name, ""); |
| }, "Text input with wrapped label with wrong ID"); |
| </script> |
| |
| <div class="container"> |
| <label for="text9">label-for-text9</label> |
| <label>label-wrapping-text9<input id="text9" type="text" title="text9-title" placeholder="text9-placeholder"></label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput9 = accessibilityController.accessibleElementById("text9"); |
| assert_equals(axTextInput9.name, |
| "label-for-text9 label-wrapping-text9"); |
| assert_equals(axTextInput9.nameFrom, "relatedElement"); |
| }, "Text input with title, placeholder, label-for and label-wrapped"); |
| </script> |
| |
| <div class="container"> |
| <label>label-wrapping-text10<input id="text10" type="text" title="text10-title" placeholder="text10-placeholder"> |
| </label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput10 = accessibilityController.accessibleElementById("text10"); |
| assert_equals(axTextInput10.name, "label-wrapping-text10"); |
| assert_equals(axTextInput10.nameFrom, "relatedElement"); |
| assert_equals(axTextInput10.description, "text10-title"); |
| assert_equals(axTextInput10.descriptionFrom, "attribute"); |
| }, "Text input with placeholder and label-wrapped"); |
| </script> |
| |
| <div class="container"> |
| <input id="text11" type="text"> |
| <label for="text11">first-label-for-text11</label> |
| <label for="text11">second-label-for-text11</label> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput11 = accessibilityController.accessibleElementById("text11"); |
| assert_equals(axTextInput11.name, |
| "first-label-for-text11 second-label-for-text11"); |
| assert_equals(axTextInput11.nameFrom, "relatedElement"); |
| }, "Text input with multiple label-for"); |
| </script> |
| |
| <div class="container"> |
| <input id="text12" type="text" title="text12-title" aria-placeholder="text12-aria-placeholder"> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput12 = accessibilityController.accessibleElementById("text12"); |
| assert_equals(axTextInput12.name, "text12-aria-placeholder"); |
| assert_equals(axTextInput12.nameFrom, "placeholder"); |
| }, "Text input with title and aria-placeholder"); |
| </script> |
| |
| <div class="container"> |
| <input id="text13" type="text" title="text13-title" aria-placeholder="text13-aria-placeholder" placeholder="text13-placeholder"> |
| </div> |
| |
| <script> |
| test(function(t) { |
| var axTextInput13 = accessibilityController.accessibleElementById("text13"); |
| assert_equals(axTextInput13.name, "text13-placeholder"); |
| assert_equals(axTextInput13.nameFrom, "placeholder"); |
| }, "Text input with title and aria-placeholder"); |
| </script> |
| |
| <script> |
| if (window.testRunner) |
| document.body.className = "hideAllContainers"; |
| </script> |
