Route management for making sure screen readers announce new pages when changing the URL without a page load
npm install screen-reader-route-manager``
npm install screen-reader-route-manager
One of the issues screen reader users face when they access Single Page Apps (SPAs) is selecting links will often not read out the page they navigate to. This library aims to fix that issue by reading out the document.title of the new page and moving focus to the top. This means that document.title must be also set correctly before routeManager.afterRouteChange() can be called.
- NVDA + Firefox - Windows
- VoiceOver + Safari - iOS
- VoiceOver + Safari - macOS
- VoiceOver + Chrome - macOS
- Talkback + Chrome - Android
- JAWS + IE11 - Windows
- JAWS + Chrome - Windows
`javascript
import routeManager from 'screen-reader-route-manager';
// To be called before the URL is changed.
routeManager.beforeRouteChange();
// To be called after the URL is changed
routeManager.afterRouteChange();
`
afterRouteChange won't execute anything if beforeRouteChange` hasn't been called. This is to prevent unwanted focus management forcing the user to the top of the page.