React Suite <DateRangePicker>не соответствует ролям ARIA флагов Lighthouse - PullRequest
0 голосов
/ 09 июля 2020

Я создал DateRangePicker с помощью React Suite и получил следующую информацию о оценке доступности Lighthouse .

[role]s do not have all required [aria-*] attributes

Использование

import { DateRangePicker } from 'rsuite';
const instance = <DateRangePicker />;
ReactDOM.render(instance);

Выполняемый фрагмент

Какие требуемые aria-* атрибуты для средства выбора мне не хватает?

введите описание изображения здесь

1 Ответ

1 голос
/ 09 июля 2020

Короткий ответ

Отсутствует aria-expanded и aria-owns.

Более длинный ответ

Из-за тот факт, что у вас есть role="combobox", есть пара ожидаемых aria атрибутов, чтобы указать состояние и отношения.

aria-extended

Это необходимо, чтобы пользователь знал, если поле со списком в настоящее время открыто или закрыто aria-expanded="true" и aria-expanded="false" соответственно.

aria-ownns

Я бы также ожидал увидеть aria-owns, чтобы указать связь между <input> (что сложно, поскольку они на самом деле, похоже, не используют <input>, если я чего-то не упускаю) и модальное окно выбора даты / всплывающее окно / панель / как вы это называете!

Другое

В приведенных примерах нет ничего недоступного с клавиатуры. Вы не можете открыть средство выбора даты с помощью введите , пробел et c.

Весь виджет выбора даты должен управляться с клавиатуры, вверх , вниз , влево , вправо и c. et c. но это не так.

Возможно, я что-то упускаю, но моя немедленная реакция такова, что он вообще недоступен, и вам лучше найти другой компонент, потому что он «проходит» автоматизированный тест, не всегда означает он пригоден для использования, попробуйте его с помощью программы чтения с экрана и посмотрите, сможете ли вы его использовать.

...