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

[Breadcrumbs] Can't expand collapsed Breadcrumbs via keyboard #19708

Closed
2 tasks done
malouro opened this issue Feb 14, 2020 · 3 comments · Fixed by #19724
Closed
2 tasks done

[Breadcrumbs] Can't expand collapsed Breadcrumbs via keyboard #19708

malouro opened this issue Feb 14, 2020 · 3 comments · Fixed by #19724
Labels
accessibility a11y component: breadcrumbs This is the name of the generic UI component, not the React module! ready to take Help wanted. Guidance available. There is a high chance the change will be accepted

Comments

@malouro
Copy link

malouro commented Feb 14, 2020

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

A collapsed set of Breadcrumbs (ie: a maxItems prop is set, and the number of inner items exceeds this value) cannot be expanded via keyboard.

Expected Behavior 🤔

Should be able to focus onto the expand button and hit enter/space to expand the set of collapsed Breadcrumbs.

Steps to Reproduce 🕹

Steps:

  1. https://codesandbox.io/s/sxhju
  2. Tab to the "Home" Breadcrumb. (Focus should be on the "Home" Breadcrumb now)
  3. Hit tab again
  4. Focus won't go to the ... button to be able to expand the Breadcrumbs via keyboard

Context 🔦

Users are unable to use the collapse/expand functionality of the Breadcrumbs component via keyboard - which would also be an issue for assistive technology users.

Your Environment 🌎

Tech Version
Material-UI latest
React latest
Browser Chrome
TypeScript
etc.
@oliviertassinari oliviertassinari added component: breadcrumbs This is the name of the generic UI component, not the React module! ready to take Help wanted. Guidance available. There is a high chance the change will be accepted accessibility a11y labels Feb 14, 2020
@oliviertassinari
Copy link
Member

I believe that we also miss a descriptive label, something we could have built-in and localize.

@captain-yossarian
Copy link
Contributor

@oliviertassinari @malouro Can I pick it up ?

@malouro
Copy link
Author

malouro commented Feb 15, 2020

@captain-yossarian that's cool with me, sure!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility a11y component: breadcrumbs This is the name of the generic UI component, not the React module! ready to take Help wanted. Guidance available. There is a high chance the change will be accepted
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants