react-component / react-component/slider
Wrong handle is being focused, when crossing
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 3.1k
- Forks
- 768
- Avg merge
- 11d 22h
- Merged PRs (30d)
- 5
Description
I was working on implementing keyboard support for the Range sliders as well. But as previously stated in the issue #131, I encountered some issues when using multiple handles within a Range slider.
Take a look at this:

What I'm doing here is moving the handle, with the mouse, across the other handle. The tooltip is being rendered correctly, but unfortunately the "focus" is left on the wrong handle. Or, the wrong handle is being moved. For mouse control this isn't much big of a deal, but for keyboard control its really not that great.

Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing the multiple-handle Range slider behavior shown in the issue, using mouse movement to cross one handle and then keyboard input. Trace the range slider's focus and keyboard handling; done means focus and subsequent keyboard movement remain on the handle that was moved across the other.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100