VKCOM/VKUI

[Bug]: ActionSheet невозможно переходить табом или стрелочками с клавиатуры по ActionSheetItem с пропом selectable

mendrew opened this issue · 1 comments

Описание

Если попробовать пример в доке https://vkcom.github.io/VKUI/#/ActionSheet пример, где ActionSheet состоит из спискаActionSheetItem со свойством selectable, то с клавиатуры становится невозможно выбрать никое значение, кроме первых двух.
При попытке использовать Tab или стрелочки ActionSheet закрывается.

Причина в том, что в режиме selectable ActionSheetItem представляет собой радио-кнопку. В примере у всех ActionSheetItem одинаковое значение name а значит все ActionSheetItem превращаются в группу радиокнопок. У группы радио кнопок в браузерах иначе обрабатываются события с клавиатуры.
Tab перекидывает фокус на следующий интерактивный элемент вне группы радио-кнопок.
При этом переходить между радио-кнопками можно с помощь стрелочек. Но у нас это не получается потому что переход между радио-кнопками генерирует событие click. А у нас по умолчанию клик закрывает ActionSheet. При этом если использовать disableAutoClose на ActionSheetItem, то переход работает, но уже невозможно поменять значение радио кнопки.

Возможно текущая реализация в режиме selectable вводит в заблуждение и стоит переделать не используя нативный radio.
Стоит продумать логику взаимодействия с клавиатуры в таком режиме. На данный момент этот режим с клавиатуры недоступен.

Версия

6.0.3

В каких браузерах воспроизводится проблема?

Chrome

Шаги воспроизведения

  1. На странице ActionSheet с клавиатуры, табом, перейти на кнопку "Выделяемые"
  2. Открыть ActionSheet c клавиатуры с помощью Enter/Space.
  3. Попробовать походить по элементам ActionSheetItem с помощью Tab.
Screenshot 2024-05-24 at 15 13 08
  1. Фокус прыгнет вне ActionSheet или на последний элемент, и т.д. Не очень очевидно куда прыгает фокус.
  2. Если попробовать перейти с помощью стрелочки вправо, то будет выделен второй элемент в списке, ActionSheet закроется, значение фильтра поменяется.

Ожидаемое поведение

Ожидается, что будет возможно выбрать элемент с клавиатуры и это будет интуитивно понятно.
Мне, как пользователю хочется, чтобы можно было также перейти по табу и выбрать опцию нажатием Enter.
Но возможно, что хочется сохранить использованием радио-кнопок, тогда надо починить выбор опций и тоже продумать как следует с этим компонентом взаимодействовать.

Скриншоты

https://github.com/VKCOM/VKUI/assets/5443359/b60711f2-e09a-4011-ad47-9a16aa68c0d6
Тут фокус прыгает из-за нажатия Tab, а потом закрывается из-за нажатия стрелочки вправо.

Пример с воспроизведением

No response