feat(DateInput): make accessible for screen readers #8419
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. |
size-limit report 📦
|
e2e tests
|
👀 Docs deployed
Commit 224b033 |
andrey-medvedev-vk
force-pushed
the
mendrew/fix/DateInput/a11y
branch
4 times, most recently
from
d664f56 to
08b6122
Compare
This role is not recommended to use by MDN Better to use native inputs, but it might be perfect fit for our case when the majority of input functionality is done by InputLike component. Need to test in NVDA
In Calendar days navigation
Preserve focus state on focused day. It means when user uses Tab to move away from focused day on calendar we keep it's value, so, when user goes back to it we focus exactly that day.
Allow to navigate to days using Tab and focusable day is current value in the input, or first day of the Month if month is changed, but input value is not.
That is allowed by validator
Add day label without specific year, as it is too match info on calendar to listen
When the calendar is opened we don't have selected value in the input Should we have one?
For some reason when we focus first or last element of DateInput from the outside using Tab, then we focus the first InputLike, but the content of it is not selected for some reason. The delay allows us to visually show the selection
It falls outside of iframe if we disable iframe. Add Panel and View and use iframe to keep render it properly inside the doc
Dialog is enough here. We allow to interact with other element before closing the Calendar
Since if follow MUI calendar we should show viewDate as label there We keep changeDayLabel in DateInput since it needs to be in the input
andrey-medvedev-vk
force-pushed
the
mendrew/fix/DateInput/a11y
branch
from
08b6122 to
224b033
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
DateInputиDateRangeInput#4932Описание
В данный момент DateInput является недоступным для скринридеров. Полный список проблем в #4932
Изменения
spintbutton(и соответствующие этой роли aria-аттрибуты) дляInputLikeкомпонентов, чтобы они не только были похожи на инпут, но и являлись для скринридеров чем-то вроде счётчиков, только тогда пользователям ассестивных технологий понятно как менять в них значение (с клавиатуры стрелочками)Теперь можно свободно перемещаться с помощью фокуса.
Календарь можно открыть только по клику на символ календаря. (Это повторяет логику нативного
input type="date"и DateInput из MaterialUI.modal.Release notes