Skip to content

fix(material/datepicker): add aria description to calendar body cells… #24950

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed

Conversation

zarend
Copy link
Contributor

@zarend zarend commented May 21, 2022

Description

Add 'Start of date range' aria description to first cell in selected
date range, and add 'End of date range' aria description to last cell in
selected date range. Fix accessibility issue where screen reader does
not communicate if the selected cell is the start date or the end date.

Fixes #23442

@zarend zarend added Accessibility This issue is related to accessibility (a11y) target: minor This PR is targeted for the next minor release area: material/datepicker dev-app preview When applied, previews of the dev-app are deployed to Firebase labels May 21, 2022
@github-actions
Copy link

github-actions bot commented May 21, 2022

@zarend zarend force-pushed the calendar-body-describe-start-end-date branch 2 times, most recently from 29a88c7 to 99ac508 Compare May 25, 2022 21:27
@zarend zarend marked this pull request as ready for review May 25, 2022 21:27
@zarend zarend requested review from mmalerba and crisbeto as code owners May 25, 2022 21:27
@zarend zarend force-pushed the calendar-body-describe-start-end-date branch from 99ac508 to 2179f5c Compare May 25, 2022 21:28
@zarend zarend force-pushed the calendar-body-describe-start-end-date branch 3 times, most recently from 2c5e956 to abd2c0d Compare June 7, 2022 22:58
@zarend zarend force-pushed the calendar-body-describe-start-end-date branch from abd2c0d to d5fc98d Compare June 8, 2022 18:16
…/end dates

Add aria descriptions to calendar cells that are the first or last date
of a date range. Describe first date of a date range as 'Start date',
last date as 'End date'. Date ranges of exactly one day are described as
'Start and end date'. Fix accessibility issue where screen reader does
not communicate if the selected cell is the start date or the end date
(angular#23442).

Fixes angular#23442
@zarend zarend force-pushed the calendar-body-describe-start-end-date branch from d5fc98d to a432e5b Compare June 13, 2022 23:00
@zarend
Copy link
Contributor Author

zarend commented Jul 14, 2022

A better approach would be to point to the text inputs via aria-describedby, no need to use MatDatepickerIntl here

@zarend zarend closed this Jul 14, 2022
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Aug 14, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Accessibility This issue is related to accessibility (a11y) area: material/datepicker dev-app preview When applied, previews of the dev-app are deployed to Firebase target: minor This PR is targeted for the next minor release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

bug(datepicker): Datepicker w/ date range It is not providing audio feedback of whether the date selection is start date or end
2 participants