Skip to content

fix: correct ARIA expanded and activedescendant states for menu buttons#9172

Open
karthikeyansundaram2 wants to merge 1 commit intovideojs:mainfrom
karthikeyansundaram2:fix/issue-7688-aria-menu-state
Open

fix: correct ARIA expanded and activedescendant states for menu buttons#9172
karthikeyansundaram2 wants to merge 1 commit intovideojs:mainfrom
karthikeyansundaram2:fix/issue-7688-aria-menu-state

Conversation

@karthikeyansundaram2
Copy link
Copy Markdown

Summary

Fixes #7688

Problem

When navigating the Chapters or Captions menus with a screen reader, the aria-expanded and aria-activedescendant attributes were not being updated correctly. This broke keyboard navigation and caused confusion for assistive technology users.

Fix

This commit fixes the issue by:

  • Setting aria-expanded='true' when the menu is shown (on hover or press)
  • Setting aria-expanded='false' and removing aria-activedescendant when the menu is hidden
  • Pointing aria-activedescendant to the ID of the currently focused menu item

This ensures screen readers accurately reflect the menu's state and which item is currently selected.

When navigating the Chapters or Captions menus with a screen reader,
the  and  attributes were not
being updated correctly. This broke keyboard navigation and caused
confusion for assistive technology users.

This commit fixes the issue by:
- Setting  when the menu is shown (on hover or press)
- Setting  and removing  when the menu is hidden
- Pointing  to the ID of the currently focused menu item

Fixes videojs#7688
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

A11Y - Broken ARIA menu on Chapters and Closed Captions (Web Accessibility)

1 participant