| <!DOCTYPE HTML> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| |
| <!DOCTYPE html> |
| <html> |
| <body> |
| <div> |
| <input id="input"> |
| <label id="input-name" for="input">cats</label> |
| </div> |
| |
| <div id="main" role="main" aria-labelledby="main-name"> |
| </div> |
| <h1 id="main-name">apples</h1> |
| |
| <div id="nav" role="navigation" aria-describedby="nav-desc"> |
| </div> |
| <h1 id="nav-desc">butter</h1> |
| |
| </body> |
| </html> |
| |
| <script> |
| function axElementById(id) { |
| return accessibilityController.accessibleElementById(id); |
| } |
| |
| test(function(t) { |
| var ax = axElementById("input"); |
| assert_equals(ax.name, "cats"); |
| document.getElementById("input-name").innerText = "dogs"; |
| assert_equals(ax.name, "dogs"); |
| }, "Changing text in a <label for> changes a name pointed to by @for"); |
| |
| test(function(t) { |
| var ax = axElementById("main"); |
| assert_equals(ax.name, "apples"); |
| document.getElementById("main-name").innerText = "oranges"; |
| assert_equals(ax.name, "oranges"); |
| }, "Changing text pointed to by aria-labelledby changes the name pointed to by @aria-labelledby"); |
| |
| test(function(t) { |
| var ax = axElementById("nav"); |
| assert_equals(ax.description, "butter"); |
| document.getElementById("nav-desc").innerText = "margarine"; |
| assert_equals(ax.description, "margarine"); |
| }, "Changing text pointed to by aria-describedby changes the description pointed to by @aria-describedby"); |
| </script> |