downshift-js / downshift-js/downshift
useSelect doesn't return focus to toggle button after selection with VoiceOver on iOS
- Dominant language
- JavaScript
- Stars
- 12.3k
- Forks
- 936
- PR merge metrics
- No merged PRs in 30d
Description
**Steps to reproduce:**
1. On an iOS device, go to the example in the docs at [https://www.downshift-js.com/use-select#basic-usage](https://www.downshift-js.com/use-select#basic-usage)
2. Enable VoiceOver.
3. Toggle the select and make a selection
**Expected result:**
After a selection is made, the focus should return back to the toggle.
**Actual result:**
Focus lands on whatever happens to be underneath the selected item.
Here's a screen recording of the bug.
https://github.com/user-attachments/assets/8b9a7a46-3aef-47ca-84dc-e79ae46004b4
---
I attempted to mitigate this in my implementation by setting a ref on the toggle button and then sending the focus back to the toggle after a selection is made with variations of the following, but no such luck. At first I thought it was a problem with my implementation, but when I checked the example in the docs I found the problem reproducible on there as well.
```
const toggleRef = useRef(null);
const { /* ... */ } =
useSelect({
// ...
onSelectedItemChange: () => toggleRef?.current?.focus(),
});
}
return (
//...
// ...
//...
);
Contributor guide
Assessment
This issue has not been assessed yet.