react-component / react-component/slider

Wrong handle is being focused, when crossing

Open
#298 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug help wanted
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:

s38lazuscn

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.

6ofduvfzna

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.