| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body id="body"> |
| |
| <div id="content"> |
| |
| <p id="p1">Test figure with aria-label.</p> |
| <figure id="figure1" aria-label="Figure 1."> |
| <img src="" alt="Alt text for Figure 1." width="20" height="20"/> |
| </figure> |
| |
| <p id="p2">Test figure with title attribute.</p> |
| <figure id="figure2" title="Figure 2."> |
| <img src="" alt="Alt text for Figure 2." width="20" height="20"/> |
| </figure> |
| |
| <p id="p3">Test figure with aria-describedby.</p> |
| <figure id="figure3" aria-describedby="fig-description"> |
| <img src="" alt="Alt text for Figure 3." width="20" height="20"/> |
| <p id="fig-description">This is the description for Figure 3.</p> |
| </figure> |
| |
| <p id="p4">Test figure with aria-roledescription attribute.</p> |
| <figure id="figure4" aria-roledescription="ARIA role description for Figure 4."> |
| <img src="" alt="Alt text for Figure 4." width="20" height="20"/> |
| </figure> |
| |
| <p id="p5">Test figure with figcaption element.</p> |
| <figure id="figure5"> |
| <img src="" alt="Alt text for Figure 5." width="20" height="20"/> |
| <figcaption id="figCaption5">Caption for Figure 5.</figcaption> |
| </figure> |
| |
| <p id="p6">Test figure with figcaption element and title attribute.</p> |
| <figure id="figure6" title="Figure 6."> |
| <img src="" alt="Alt text for Figure 6." width="20" height="20"/> |
| <figcaption id="figCaption6">Caption for Figure 6.</figcaption> |
| </figure> |
| |
| </div> |
| |
| <p id="description"></p> |
| <div id="console"></div> |
| |
| <script> |
| description("This tests that the 'figure' element is accessible on iOS."); |
| |
| if (window.accessibilityController) { |
| for (var k = 1; k <= 6; k++) { |
| var p = document.getElementById("p" + k); |
| debug(p.innerText); |
| var figure = window.accessibilityController.accessibleElementById("figure" + k); |
| debug("figure" + k + ": " + figure); |
| debug("figure" + k + " " + figure.roleDescription); |
| debug("figure" + k + " " + figure.description); |
| debug("figure" + k + " " + figure.helpText); |
| |
| var titleUIElement = figure.titleUIElement(); |
| if (k >= 5) { |
| var figureCaption = accessibilityController.accessibleElementById("figCaption" + k); |
| shouldBeTrue("titleUIElement.isEqual(figureCaption)"); |
| } else |
| shouldBeTrue("!titleUIElement"); |
| |
| debug(""); |
| } |
| |
| document.getElementById("content").innerText = ""; |
| } |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
