Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug Report][3.7.6] [Bug Report][3.7.6] VMenu: keyboard events not properly working when using NVDA #20828

Open
artiomleo opened this issue Jan 3, 2025 · 1 comment

Comments

@artiomleo
Copy link

Environment

Vuetify Version: 3.7.6
Vue Version: 3.5.13
Browsers: Chrome 131.0.0.0
OS: Windows

Steps to reproduce

Environment
Vuetify Version: 3.7.6
Vue Version: 3.5.13
Browser: Chrome 131.0.0.0
OS: Windows 11 Pro
Version: 10.0.26100

Steps to reproduce

  1. Enable NVDA Screen Reader
  2. Focus the menu trigger and press Enter
  3. Press Tab (it will focus the first menu item)
  4. Press Enter (nothing happens, the menu just closes)
  5. Press ArrowDownkey (nothing happens, it looks like focus is moved outside the menu element)
  6. After pressing ArrowDownkey 2 times, and pressing Enter, it will focus the second or the third element after the menu

Expected Behavior

Expect it to work exactly the same as without NVDA

Actual Behavior

Enter, ArrowDown, ArrowUp events not properly working. Focus broken.
Note that it works correctly on MacOS with VoiceOver

Reproduction Link

https://play.vuetifyjs.com/#...

@artiomleo
Copy link
Author

Try adding role="menu" and role="menuitem" on the menu wrapper and menu items

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant