Skip to content

make dynamic tabs actually ARIA 1.1 practices compliant #28918

@patrickhlauke

Description

@patrickhlauke

A breaking change, but would like to squeeze this into v5 if we can: turn dynamic tabs into actual "Tabs with automatic activation" (see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html and https://www.w3.org/TR/wai-aria-practices-1.1/#tabpanel)

  • only the currently selected/active tab receives focus, all other tabs are not focusable (tabindex="-1" added dynamically to them)
  • cursor keys cycle between tabs, setting both the tabindex="0" and aria-selected="true" to the newly active tab (and tabindex="-1" / aria-selected="false" on the now not selected one)
  • mouse behavior can remain as now (though need to flip tabindex accordingly)
  • document this in the docs, referencing specifically the "automatic activation" route (so authors aren't confused/don't wonder why using SPACE or whatever does nothing)

Metadata

Metadata

Assignees

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions