Breadcrumbs lose focus when a breadcrumb link is clicked to become the current page
- Dominant language
- TypeScript
- Stars
- 15.9k
- Forks
- 1.6k
- Avg merge
- 3d 9m
- Merged PRs (30d)
- 59
Description
# 🐛 Bug Report
In Breadcrumbs, when a breadcrumb link with focus gets triggered, the link becomes `disabled` and `tabIndex` is removed, which means focus gets lost to the `document.body`. Also, since the blur event does not get fired for the breadcrumb link when it becomes `disabled`, the FocusRing may still be rendered.
## 🤔 Expected Behavior
The current, `disabled` Breadcrumb link should probably have `tabIndex="-1"`, so that it will still be focusable when its state changes.
## 😯 Current Behavior
In Breadcrumbs, when a breadcrumb link with focus gets triggered, the link becomes `disabled` and `tabIndex` is removed, which means focus gets lost to the `document.body`.
## 💁 Possible Solution
## 🔦 Context
This was identified as an issue testing a quarry component that uses breadcrumbs to track position within folders. When the Breadcrumb for an ancestor of the current folder was activated to become the new current folder, focus within the app would get lost to the `document.body`.
## 💻 Code Sample
## 🌍 Your Environment
| Software | Version(s) |
| ---------------- | ---------- |
| react-spectrum | @react-spectrum/breadcrumbs@3.2.3
| Browser | All
| Operating System | All
## 🧢 Your Company/Team
Adobe/Accessibility
## 🕷 Tracking Issue (optional)
Contributor guide
Assessment
This issue has not been assessed yet.