casesandberg / casesandberg/react-color
Flikering issue in slider Hue component
- Dominant language
- JavaScript
- Stars
- 12.3k
- Forks
- 920
- PR merge metrics
- No merged PRs in 30d
Description
https://github.com/casesandberg/react-color/blob/bc9a0e1dc5d11b06c511a8e02a95bd85c7129f4b/src/helpers/hue.js#L33
Check should be done for left>= containerWidth
because when left=== containerWidth it will return h= 360 which in hsl turn out to be h = 0 hence a flikering issue happens in the slider
https://github.com/casesandberg/react-color/assets/58743345/6202777c-b5a1-4ecc-a217-9c8ebde3f0df
Contributor guide
Research direction
Start by reading src/helpers/hue.js at line 33 and inspect the boundary behavior when left equals containerWidth. Reproduce the Hue slider flicker shown in the issue, then verify that the boundary case no longer causes the hue to wrap between 360 and 0.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 1/5
- Estimated time
- Under an hour
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 55/100