aria-notify-priority-queue-manual.html (1770B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>ARIA Notify API Test: Priority Queue</title> 5 <link rel="help" href="https://github.com/w3c/aria/pull/2577"> 6 <link rel="author" title="Jacques Newman" href="mailto:janewman@microsoft.com"> 7 <script src="core-aam/arianotify/resources/aria-notify-helpers.js"></script> 8 </head> 9 <body> 10 <h1>ARIA Notify API Test: Priority Queue</h1> 11 <p>This test checks the behavior of the <code>ariaNotify</code> API with mixed priority messages to test queue 12 behavior.</p> 13 14 <h2>Setup Instructions</h2> 15 <p><strong>Setup:</strong> Use a screen reader (NVDA, JAWS, VoiceOver, etc.) or other assistive technology that 16 supports the ARIA Notify API.</p> 17 <p><strong>Instructions:</strong> Click the "Run Test" button and listen for the announced text from your screen reader.</p> 18 19 <div> 20 <h3>Test: A Normal Priority Message Followed by a High Priority Message</h3> 21 <p>A normal-priority "Loading..." message followed by a high-priority "Loading failed." message, both fired against 22 the document.</p> 23 <p><strong>Expected:</strong> Screen reader should announce "Loading..." at normal priority, then "Loading failed." 24 at high priority. The high priority message should be prioritized in the queue.</p> 25 26 <button onclick="test()">Run Test</button> 27 <div id="status"></div> 28 29 <script> 30 function test() { 31 // Fire the first message at normal priority 32 let status = tryCallAriaNotify(document, 'Loading...', { priority: 'normal' }); 33 // Fire the second message at high priority 34 status += ' ' + tryCallAriaNotify(document, 'Loading failed.', { priority: 'high' }); 35 document.getElementById('status').textContent = status; 36 } 37 </script> 38 </div> 39 </body> 40 41 </html>