bem / bem/bem-components

Remove the tabIndex property from the blocks public API

Open
#1,675 0 comments 0 reactions 0 assignees View on GitHub
a11y HTML JS ready v3
Dominant language
JavaScript
Stars
330
Forks
88
PR merge metrics
No merged PRs in 30d

Description

In general, all focusable components should receive focus sequentially in the order they appear on a page. Authors should not use a positive values of the `tabindex` attribute without an absolute necessity.
Look the links below for more detailed explanation:

http://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-focus-order.html
http://www.w3.org/TR/2015/NOTE-WCAG20-TECHS-20150226/F44

We should remove the `tabIndex` property from the blocks public API.
The existing focusable components have `_disabled` modifier, that excludes them from the focus navigation.

Any new focusable component, which implementation is not based on the native HTML focusable controls (such as ``, `` etc.), should add `tabindex=0` implicitly by themselves.
They may implement the `_disabled` modifier, that sets `tabindex=-1` if needed.

In an exceptional cases authors may implement a composite widget with some focusable controls inside with non sequential focus order. This logic should be implemented and incapsulated by this widget. As the current library implementation does not contain such widgets, so the solution should be implemented on the project side by redefining library components if needed.

This change breaks backwards compatibility and should be done in `v3`.

Contributor guide

Open the contributing guide

Research direction

The issue names no specific files or tests. Start by locating the blocks public API and existing focusable components, then inspect how _disabled affects focus navigation. Done means tabIndex is removed from the public API, native and custom focus behavior follows the stated rules, and the breaking change is suitable for v3.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
accessibility, frontend
Issue type
Refactor
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.