Перейти к содержанию

Обзор

ui.a11y — JavaScript-расширение Bitrix Framework для сценариев доступности в интерфейсе. Оно помогает управлять фокусом, определять способ ввода, проверять интерактивность DOM-элементов и передавать сообщения скринридеру через live region.

Используйте расширение, когда компонент открывает модальное окно, удаляет активный элемент из DOM, строит клавиатурную навигацию внутри меню или должен сообщить пользователю об изменении интерфейса без перемещения фокуса.

Выбрать статью

Задача Статья
Вернуть фокус после закрытия панели, удаления элемента или перерисовки интерфейса Монитор фокуса FocusMonitor
Найти фокусируемый элемент и программно переместить на него фокус Навигация фокуса FocusNavigator
Удержать фокус внутри модального окна, диалога или выпадающей панели Ловушка фокуса FocusTrap
Настроить переходы по элементам с помощью стрелок, Home, End и других клавиш Зона фокуса FocusZone
Определить, чем пользователь управлял интерфейсом: клавиатурой, мышью, стилусом или касанием Трекер способа ввода InputModalityTracker
Проверить, видим ли элемент, доступен ли он и может ли получить фокус Проверка интерактивности InteractivityChecker
Передать сообщение скринридеру без перемещения фокуса Объявления для скринридера LiveAnnouncer

Подключить расширение

Если вы подключаете JavaScript API из PHP, загрузите расширение ui.a11y.

\Bitrix\Main\UI\Extension::load('ui.a11y');

В модульном JavaScript импортируйте нужные классы из ui.a11y.

import { FocusMonitor, FocusTrap, FocusZone, LiveAnnouncer } from 'ui.a11y';