bryntum / support

An issues-only repository for the Bryntum project management component suite which includes powerful Grid, Scheduler, Calendar, Kanban Task Board and Gantt chart components all built in pure JS / CSS / TypeScript
https://www.bryntum.com
54 stars 6 forks source link

Accessibility Date Picker Widget: Does not announce selection status and week day name for selected date in date picker #9927

Closed matsbryntse closed 2 months ago

matsbryntse commented 2 months ago

Forum post

The screen reader does not announce information relevant for the accessibility technologies user.

We have spotted two potential issues here: Being the most relevant: when used screen reader to read the date cell that is currently selected it is not told to the user that the cell focused is the one that is selected in the date picker. (See issue in: VoiceoverDoesntReadSelectedStateOfFocusedCell.png)

This will be breaking WCAG 1.1.1 - Non-text Content: https://www.w3.org/WAI/WCAG21/Understanding/non-text-content.html As it is information that the visual user know as the styling of the cells is changed, but non-visual users wouldn't tell as screen reader doesn't output the selected state of the cell.

Screen reader does not announce the weekday for the currently focused cell. Which could be breaking also WCAG 1.1.1 - Non-text Content: As the visual user would know the weekday of the cell thanks to the datatable calendar, but the won't visual user would have problems detecting this information.

Steps to reproduce in bryntum example: https://bryntum.com/products/calendar/examples/print/

Navigate to the calendar date picker using keyboard. Turn On SR Move focus to the calendar date picker current selected cell. Notice how SR is not either telling that the focused cell is selected and which weekday it is. NVDADoesntReadSelectedStateOrWeekday.png VoiceoverDoesntReadSelectedStateOfFocusedCell.png