[bug]: Incorrect result type in SpringValue onChange handler #2183

Activity

1. mattrossman

   added

   template: bugThis issue might be a bugThis issue might be a bug

   on Aug 3, 2023
2. Bilalshaikh15 commented on Aug 9, 2023

   

   Bilalshaikh15

   on Aug 9, 2023

   Last edited by joshuaellis

   More actions

   The onChange callback of the SpringValue is triggered whenever the animation state updates, which includes both the start and end states of the animation. However, at the start of the animation, the value property of the animation result might not have been set yet, leading to undefined being logged.

   If you want to log the animated value specifically when it changes, you should use the onRest callback instead. The onRest callback is triggered when the animation completes and the final value is available. Here's an example of how you might modify your code:

   const [spring] = useState(
       () =>
         new SpringValue(0, {
           onRest(result) {
             console.log(result.value);
           }
         })

   so if you log result.value now the number 1 or 0 would be printed in the console.

   Please let me know did i fix th issue,
   as i am new in contributing to open source can you tell me the project file location so i could commit changes.
3. mattrossman commented on Aug 9, 2023

   

   mattrossman

   on Aug 9, 2023

   Author

   More actions

   Thank you for the suggestion. You're correct that within onRest, result contains and AnimationResult as expected. I'm specifically trying to use onChange here though, as I want to read intermediate values throughout the transition.

   The reason my example is printing undefined is because result contains the actual value (a number) in the onChange callback instead of an AnimationResult type, and trying to read the "value" property from a number is undefined.

   I can get the output I want by logging the result itself: https://codesandbox.io/s/busy-hugle-5w6px4?file=/src/App.tsx

   The change I'm requesting is to ensure result holds an AnimationResult instead of a plain value to be consistent with the type signature and other callbacks.
4. incon commented on Apr 3, 2025

   

   incon

   on Apr 3, 2025

   More actions

   I'm having the same Typescript type issues. The onChange value is a number type and not the AnimationResult<SpringValue> type.
5. sadan4 commented on Oct 21, 2025

   

   sadan4

   on Oct 21, 2025

   More actions

   Just ran into this after wondering why nothing was working for a while. Would be nice to get this fixed.
6. joshuaellis

   added

   kind: bugSomething isn't workingSomething isn't working

   area: typescriptTypescript issuesTypescript issues

   release: major

   and removed

   template: bugThis issue might be a bugThis issue might be a bug

   on May 23, 2026
7. joshuaellis

   added this to the v11.0.0This milestone has been deleted milestone on May 23, 2026
8. joshuaellis

   removed this from the v11.0.0This milestone has been deleted milestone on Jun 11, 2026
9. joshuaellis commented on Jun 19, 2026

   

   joshuaellis

   on Jun 19, 2026

   Member

   More actions

   Not an any leak — the type is already correct (result.value is number). It's a runtime/type mismatch: the SpringValue-level onChange is called with the raw value instead of an AnimationResult, so result.value is undefined.

   SpringValue._onChange (packages/core/src/SpringValue.ts):

   protected _onChange(value: T, idle?: boolean) {
     if (!idle) {
       this._onStart()
       callProp(this.animation.onChange, value, this)   // raw value
     }
     callProp(this.defaultProps.onChange, value, this)  // raw value
     super._onChange(value, idle)
   }

   onChange(result) is handed 5, so result.value is (5).value → undefined. Logging the whole result shows 5 because result is the value itself.

   onChange is the only event that does this. onStart and onRest already dispatch an AnimationResult (getFinishedResult/getCancelledResult), and the Controller-level onChange sets result.value before calling the handler. Only the SpringValue-level onChange skips it.

   Fix

   Wrap the value in an AnimationResult, mirroring onStart/onRest:

   protected _onChange(value: T, idle?: boolean) {
     const result = getFinishedResult(value, false) // { value, finished: false, cancelled: false }
     if (!idle) {
       this._onStart()
       callProp(this.animation.onChange, result, this)
     }
     callProp(this.defaultProps.onChange, result, this)
     super._onChange(value, idle) // leave raw — internal fluid observers depend on it
   }

   Leave super._onChange(value) untouched: that emits the internal change event the Controller/animated tree subscribe to, which expects the raw value.

   This aligns the runtime with the AnimationResult contract the type already advertises, so typed code keeps compiling — result.value just stops being undefined. Pair it with a runtime test asserting result.value matches the spring's current value during a change; the type side is covered by a .test-d guard.
10. joshuaellis

    added

    area: corerelates to core classes // parts of the libraryrelates to core classes // parts of the library

    and removed

    area: typescriptTypescript issuesTypescript issues

    release: major

    on Jun 19, 2026
11. joshuaellis

    closed this as completedin #2548on Jun 21, 2026