[Accessibility] [Pagination] Basic Pagination >Dots (....) are not hidden from screen readers.
Environment: Windows 11 / Chrome 137 / JAWS 2025 Windows 11 / Edge 136 / NVDA 2025 Mac 15 / Safari / VoiceOver
Steps to Reproduce:
- Open the URL – https://react-magma.cengage.com/version/4.9.1/api/pagination/
- Turn on a screen reader (JAWS/NVDA/VoiceOver).
- Launch 'Pagination' component page from left navigation.
- On the 'Pagination' page, under 'Basic Pagination'.
- Use arrow keys to navigate through the pagination items.
Actual Result: The screen reader announces the dots (...) used to indicate skipped pages, even though they are not interactive or meaningful. These dots are included within the list markup, causing the screen reader to announce an incorrect list count, which misrepresents the number of actual pagination items.
Refer to Screencast:https://app.screencast.com/KIzFbm0gOQi52
Expected Result: The dots (...) should be hidden from screen readers using aria-hidden="true" or similar techniques. The list count should be accurately announced by the screen reader, excluding the non-interactive dots.
User Impact: Screen reader users may be confused or misled by the announcement of non-interactive dots, making it harder to understand or navigate the pagination structure effectively.
WCAG Guideline: 1.3.1 Info and Relationships (Level A)
Bug Fix Recommendation: Apply aria-hidden="true" to the dots (....) in the pagination component.