Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Range slider value label changes handle position and causes jittering

See original GitHub issue

Description When the range sliders’ (most notably with step smaller than 1) handle is dragged, the numeric value label changes its size, that causes slider width change, and that causes handle position change to a slightly different value.

To Reproduce Steps to reproduce the behavior:

Add a range slider to a component story with step = 0.01
Interact with handle
Observe prop value jittering

Expected behavior Slider stays in place while interacting with it

Screenshots

https://user-images.githubusercontent.com/6731101/110794202-cb635000-8275-11eb-8780-35a15f401d62.mov

Issue Analytics

State:
Created 3 years ago
Comments:8 (8 by maintainers)

Top GitHub Comments

1reaction

shilmancommented, Jun 14, 2021

Whoopee!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.3.0-rc.5 containing PR #15145 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb upgrade --prerelease

Closing this issue. Please re-open if you think there’s still more to do.

1reaction

DallasGalecommented, Apr 28, 2021

@shilman I am going to have to pass on this, my day dev job has been taking up all my time. Hopefully i can jump back into another issue soon though. D