Skip to content

fix(VMenu): remove redundant aria-owns breaking VoiceOver on Safari - #23059

Open
waterWang wants to merge 1 commit into
vuetifyjs:masterfrom
waterWang:fix/vmenu-aria-owns-safari-voiceover
Open

fix(VMenu): remove redundant aria-owns breaking VoiceOver on Safari#23059
waterWang wants to merge 1 commit into
vuetifyjs:masterfrom
waterWang:fix/vmenu-aria-owns-safari-voiceover

Conversation

@waterWang

Copy link
Copy Markdown
Contributor

Fixes #22540

Problem

The aria-owns attribute was added to the VMenu activator in commit 975a18c (PR #22240) alongside the existing aria-controls. On Safari + VoiceOver, this causes the menu item labels to not be read — only "menu item" is announced without the label text.

Root Cause

aria-owns on Safari + VoiceOver interferes with the reading of the menu item labels. The reporter confirmed that removing aria-owns from the DOM resolves the issue.

Fix

Remove the redundant aria-owns attribute from the VMenu activator props. The aria-controls attribute already establishes the relationship between the activator and the menu content, making aria-owns unnecessary and duplicative.

The original issue (#22226) that prompted adding aria-owns is still addressed by the aria-controls attribute, which is the correct ARIA attribute for indicating a controlling relationship between elements.

Testing

  • VoiceOver on Safari: menu items now read their labels correctly
  • Chrome: unaffected (works with or without aria-owns)
  • No change to the valid-file upload path

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.

[Bug Report][3.11.7] Menu items in v-menu have no accessible labels with VoiceOver on Safari (probably aria-owns issue)

1 participant