[Slider] onValueCommit not being called properly

[vctormb]

Bug report

Sometimes the onValueCommit prop is not being called properly when moving the thumb.

Current Behavior

When moving the thumb sometimes the onValueCommit prop is not called.

Expected behavior

To always call the onValueCommit prop when the user stops sliding

Reproducible example

I'm using the same example from the documentation.

Screen.Recording.2022-11-06.at.12.15.41.mov

Your environment

Software	Name(s)	Version
Radix Package(s)	slider	1.1.0
React	n/a	18.2
Browser	chrome	107.0.5304.87 (Official Build) (arm64)
Assistive tech
Node	n/a
npm/yarn
Operating System	macOS	Version 13.0

[benoitgrelard]

Hey @vctormb,

I am unable to reproduce this on my side, what browser/OS are you using and how do your replicate it?

[vctormb]

Hey @vctormb,

I am unable to reproduce this on my side, what browser/OS are you using and how do your replicate it?

Hey @benoitgrelard! chrome v107 / macOS v13 ventura.

I just opened up the slider docs and moved the thumb really fast. Keep sliding until you notice that the onValueCommit wasn't called

[benoitgrelard]

I'm not yet on Ventura, but I cannot reproduce the issue with the same chrome v107.

I notice in the video that when it happens if when you released outside the codesandbox iframe.
Although, this doesn't break things for me, could you try to do this but slowly and see if it still breaks for you?
Perhaps it could be a pointer capture bug in Ventura?

[vctormb]

I'm not yet on Ventura, but I cannot reproduce the issue with the same chrome v107.

I notice in the video that when it happens if when you released outside the codesandbox iframe. Although, this doesn't break things for me, could you try to do this but slowly and see if it still breaks for you? Perhaps it could be a pointer capture bug in Ventura?

Oh, right! Here it is another video doing it slowly

Screen.Recording.2022-11-07.at.10.54.26.mov

[benoitgrelard]

Sorry, I meant trying to reproduce what you did in the first video.

Notice how when it started failing, you dragged but went so fast that you released above the code part of codesandbox, rather than the iframe where the demo is rendered?

Could you try to do this but slowly to see if it's due to pointer capture, rather than some weird speed thing?

Thanks 🙏

[vctormb]

Sure! Is this a valid example? If not, please let me know so I can record another one 😅

Screen.Recording.2022-11-07.at.11.06.58.mov

[benoitgrelard]

Ok, well that shows it has nothing to do with the iframe, thanks.
However, I'm still struggling to reproduce it or understand how you are doing it 😀

One thing to note is that onValueCommit will only trigger is the value has actually changed, but from what I can see (although tricky with just watching a video) it looks like you are changing it.

Could you try logging the value you receive in onValueCommit and also logging the value in onValueChange and reproduce?

[vctormb]

here it is

Screen.Recording.2022-11-07.at.13.14.14.mov

[vctormb]

It looks like that in Firefox it's working properly 🤔

[benoitgrelard]

How about Safari?
Wondering if it's a Webkit/Chromium based bug in Ventura only…

[vctormb]

Safari is working good too

[bukinoshita]

This is definitely odd, but I was able to reproduce after a couple of tries.

• Ventura 13
• Chrome 107.0.5304.87 (Official Build) (x86_64)

screenshot.2022-11-07.at.14.40.18.mp4

[latin-1]

It's 100% reproducible if you drag the thumb, then move the cursor outside the slider, and then release the mouse.