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

A11y Issue: Keyboard user is not able to access the focusable control present in the ng-select MenuOption #2284

Open
sachinkkarande opened this issue Sep 20, 2023 · 0 comments
Assignees

Comments

@sachinkkarande
Copy link

Describe the bug
A11y Issue: Keyboard user is not able to access the focusable control present in the MenuOption
Keyboard focus is not going inside the MenuOption if the Menu option contains a Focusable element like Button/Tooltip Icon.

This is Accessibility issue since the Actionable control inside MenuOption is only accessible through the Mouse and not with the keyboard.

Reproducbile example
Refer https://stackblitz.com/edit/ng-select-option-tooltip?file=src%2Fapp%2Fapp.component.html

In the example, Inside MenuOption there is an info icon having tooltip.
Try using only the keyboard, and observe that the keyboard user is not able to focus on the info icon and the user is not able to see the tooltip.
Observe that ToolTips are visible for users using Mouse.

This is a kind of blocker from an Accessibility perspective for keyboard-only users.

Expected behavior
Keyboard only users should be able to navigate to actionable HTML controls(Like buttons) inside MenuOptions.

Screenshots
Refer "ng-select-menu-option-having-actionable-control.png"
ng-select-menu-option-having-actionable-control

Also refer "ng-select-MeuOption-having-Focusable-item-not-keyboard-accessible.gif".
ng-select-MeuOption-having-Focusable-item-not-keyboard-accessible

Desktop (please complete the following information):

  • OS: Not related to any specific OS.
  • Browser: Not related to any specific Browser.
  • Version Not related to any specific Version.

Additional context
This is Accessibility Issue.

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

2 participants