aria-notify-language-announcement-manual.html (2173B)
1 <!DOCTYPE html> 2 <head> 3 <title>ARIA Notify API Test: Language Announcement</title> 4 <link rel="help" href="https://github.com/w3c/aria/pull/2577"> 5 <link rel="author" title="Jacques Newman" href="mailto:janewman@microsoft.com"> 6 <script src="core-aam/arianotify/resources/aria-notify-helpers.js"></script> 7 </head> 8 <html> 9 <head> 10 <title>ARIA Notify API Test: Language-Specific Announcement</title> 11 <link rel="help" href="https://github.com/w3c/aria/pull/2577"> 12 <link rel="author" title="Jacques Newman" href="mailto:janewman@microsoft.com"> 13 </head> 14 <body> 15 <h1>ARIA Notify API Test: Language-Specific Announcement</h1> 16 <p>This test checks the behavior of the <code>ariaNotify</code> API with a language-specific announcement.</p> 17 18 <h2>Setup Instructions</h2> 19 <p><strong>Setup:</strong> Use a screen reader (NVDA, JAWS, VoiceOver, etc.) or other assistive technology that 20 supports the ARIA Notify API.</p> 21 <p><strong>Instructions:</strong> Click the "Run Test" button and listen for the announced text from your screen reader.</p> 22 23 <h2>Test Expectations</h2> 24 <ul> 25 <li>Screen reader should announce "¡Hola mundo!" using Spanish pronunciation and the button element as context</li> 26 </ul> 27 28 <p><strong>Note:</strong> If the ariaNotify API is not supported in your browser, the test will show an appropriate 29 error message.</p> 30 31 <div> 32 <h3>Test: Simple Announcement on Specific Element with Specific Language</h3> 33 <p>A screen reader announcement against the button that triggers it, with no additional options but a lang attribute 34 on the button set to "es" for Spanish. The announcement text is "¡Hola mundo!".</p> 35 <p><strong>Expected:</strong> Screen reader should announce "¡Hola mundo!" using Spanish pronunciation and the 36 button element as context.</p> 37 38 <button id="test-button" lang="es" onclick="test()">Ejecutar Prueba</button> 39 <div id="status"></div> 40 41 <script> 42 function test() { 43 const button = document.getElementById('test-button'); 44 document.getElementById('status').textContent = tryCallAriaNotify(button, '¡Hola mundo!'); 45 } 46 </script> 47 </div> 48 </body> 49 50 </html>