Why am I getting back null return values from useSpring?

[patrickliechty]

This is my code:

const [{ x, y, boundaries }, set] = useSpring(() => ({
    x: current[0],
    y: current[1],
    boundaries: {
      top: 0,
      left: 0,
      right: getInnerWidth(),
      bottom: getInnerHeight(),
    },
  }))

current is [0,0] and [0,40] later. I also call the set function with values like [0,0] again. It returns valid values when [0,0] is passed, but [0,40] makes it return null values for some reason. I get a can not access x of undefined. Why would useSpring ever return null values? I don't see anything in the documentation saying that sometimes it may return null values. I would think if anything it would just return what I sent.

[zachintosh]

I am also working on this code. To further clarify, useSpring returns this: [undefined, async start(props) => ... , keys => {...}]

It is only happening in one place. Code is running on v9.0.0-rc3.

[idowald]

Same thing, I use UseSpring, I've migrated successfully to v9 from 8,
Everything works well. but in special situation I get the same problem.

[joshuaellis]

Sorry all, i've missed this. Would someone be able to provide a codesandbox and I can potentially look into this and offer some insight?

[idowald]

@joshuaellis Wow man quick response.
I'm trying to investigate my repo and create a codesandbox.
But I can't access https://react-spring.io/ anymore.

[joshuaellis]

There was a domain issue, please check again.

[idowald]

@joshuaellis thanks, works again!
I found the source of the problem.
It is hard to reproduce on Sandbox especially when there aren't any with v9.
But I will write the scenarios that were a problem:
useSpring is used with some useState on the same Component.
During useSpring updates, the useState also update the component with some setState from other side effect.
So for some reason the useSpring hook returns null instead of any value.
How I fixed it?
First I debugged my code by removing all setState hooks and replaced it with some static data.
After it was fixed,
Final solution: I replaced a state update to change with a timeout in a useEffect, instead of directly updating.

[joshuaellis]

There are definitely sandboxes with v9 –

Clicking on the button creates the sandbox with the latest version of react-spring. But im glad you solved your issue.

[idowald]

I will try to create a sandbox, just for the sake of the community