| <!DOCTYPE HTML> |
| <html> |
| <body> |
| <script src="../resources/js-test.js"></script> |
| |
| <style>canvas { display: inline; border: 1px solid #000; }</style> |
| <!-- No whitespace between canvases on purpose, so there's the same |
| number of children of the container element on all platforms. --> |
| <div id="container" tabIndex=0 aria-label="Container"><canvas id="canvas1" width="100" height="100" aria-label="Canvas label">Fallback text</canvas><canvas id="canvas2" width="100" height="100"><button>Inner button</button></canvas><canvas width="100" height="100"></canvas></div> |
| |
| <div id="console"></div> |
| <script> |
| description("This test makes sure that a canvas with and without fallback content each has the right role and description.") |
| |
| if (window.testRunner && window.accessibilityController) { |
| testRunner.dumpAsText(); |
| |
| document.getElementById('container').focus(); |
| var axContainer = accessibilityController.focusedElement; |
| |
| shouldBe("axContainer.childrenCount", "2"); |
| |
| var axCanvas1 = axContainer.childAtIndex(0); |
| debug('Canvas 1 description: ' + axCanvas1.name); |
| debug('Canvas 1 role: ' + axCanvas1.role); |
| |
| var axCanvas2 = axContainer.childAtIndex(1); |
| debug('Canvas 2 description: ' + axCanvas2.name); |
| debug('Canvas 2 role: ' + axCanvas2.role); |
| } |
| |
| </script> |
| |
| </body> |
| </html> |