Svelte: Immediate tweened store value update with { duration: 0 } option

Created on 11 Feb 2020  路  5Comments  路  Source: sveltejs/svelte

Is your feature request related to a problem? Please describe.
In Firefox and Safari, when there's a tweened store and we call tweenedStore.update(fn, {duration: 0}) sometimes the tweened value gets computed to NaN. Then I went to read about how the value gets computed:
https://github.com/sveltejs/svelte/blob/master/src/runtime/motion/tweened.ts#L121
As the result is based on elapsed/duration, which makes sense to not have duration to be 0 mathematically. Although, in FF and Safari the elapsed variable can be 0 when compute is getting executed, which causes the result of the compute to be NaN.

Describe the solution you'd like
if the options.duration is 0 then we set the value right away instead of going through the interpolation compute ?

Describe alternatives you've considered

  • We can clamp the lower bound duration to 1, just in case another person runs into situation like this
  • error on passing options.duration when <=0

How important is this feature to you?
Currently I'm using {duration: 1} as a work around. when I want to update some tweened store "immediately". I'm curious about what would be a good way to handle this tho !

Additional context
Thanks for reading !

enhancement

Most helpful comment

This has been implemented in 3.22.0.

All 5 comments

I'd prefer to early-out and immediately set the value in this case as well.

I bumped into this issue while implementing touch gestures for an image gallery. I wanted to set the value immediately when handling touch events, but have the possibility to tween/spring the values when, for example, the user's gesture moved something a bit too far and I need to revert state to the nearest sensible value.

This has been implemented in 3.22.0.

Thanks for the quick merge and release @Conduitry!

Thanks !

Was this page helpful?
0 / 5 - 0 ratings