SSR causes "Cannot destructure property 'reset' of 'props' as it is null."

[tnorlund]

I'm attempting to learn TypeScript by TypeScript-ifying my blog. I heavily rely on react-spring. I have upgraded to npm:@react-spring/web@^9.0.0-rc.1 and am using Gatsby to serve the static content.

When I develop the site, I now get an error during SSR:

Cannot destructure property 'reset' of 'props' as it is null.

Is there a way to get around this?

[joshuaellis]

I don't think we have any maintainers right now who worked on 9.0.0-rc.1 sorry, if you upgrade to v9 we might be able to help. otherwise someone else might be able to.

[good3n]

I'm also getting this on Gatsby.

@joshuaellis I found a working sandbox using v8.0.27 - I reverted my app to this version and the error is gone.

I forked that sandbox and updated to v9.4.2 and the error is there: https://codesandbox.io/s/toggle-react-spring-transition-forked-1tyry?file=/src/App.js

TypeError: Cannot destructure property 'reset' of '(intermediate value)(intermediate value)(intermediate value)' as it is null.
    at useTransition (https://ju2jd.csb.app/node_modules/@react-spring/core/dist/react-spring-core.esm.js:1872:17)

    at CartItems (https://ju2jd.csb.app/src/App.js:38:54)

    at renderWithHooks (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:14977:18)

    at mountIndeterminateComponent (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:17803:13)

    at beginWork (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:19041:16)

    at HTMLUnknownElement.callCallback (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:3945:14)

    at Object.invokeGuardedCallbackDev (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:3994:16)

    at invokeGuardedCallback (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:4056:31)

    at beginWork$1 (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:23956:7)

    at performUnitOfWork (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:22768:12)

    at workLoopSync (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:22699:5)

    at renderRootSync (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:22662:7)

    at performSyncWorkOnRoot (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:22285:18)

    at scheduleUpdateOnFiber (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:21873:7)

    at updateContainer (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:25474:3)

    at eval (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:26013:7)

    at unbatchedUpdates (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:22423:12)

    at legacyRenderSubtreeIntoContainer (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:26012:5)

    at Object.render (https://ju2jd.csb.app/node_modules/react-dom/cjs/react-dom.development.js:26095:10)

    at $csb$eval (https://ju2jd.csb.app/src/index.js:16:19)

    at H (https://codesandbox.io/static/js/sandbox.397b24ba3.js:1:99995)

    at K.evaluate (https://codesandbox.io/static/js/sandbox.397b24ba3.js:1:112619)

    at ge.evaluateTranspiledModule (https://codesandbox.io/static/js/sandbox.397b24ba3.js:1:123001)

    at ge.evaluateModule (https://codesandbox.io/static/js/sandbox.397b24ba3.js:1:122500)

    at https://codesandbox.io/static/js/sandbox.397b24ba3.js:1:315639

    at c (https://codesandbox.io/static/js/vendors~app~embed~sandbox~sandbox-startup.bcc15d438.chunk.js:1:3629)

    at Generator._invoke (https://codesandbox.io/static/js/vendors~app~embed~sandbox~sandbox-startup.bcc15d438.chunk.js:1:3382)

    at Generator.forEach.t.<computed> [as next] (https://codesandbox.io/static/js/vendors~app~embed~sandbox~sandbox-startup.bcc15d438.chunk.js:1:3986)

    at r (https://codesandbox.io/static/js/vendors~app~embed~sandbox~sandbox-startup.bcc15d438.chunk.js:1:206)

    at u (https://codesandbox.io/static/js/vendors~app~embed~sandbox~sandbox-startup.bcc15d438.chunk.js:1:417)

[joshuaellis]

@good3n If this is an issue, please open a new one and follow the template 😄 Happy to go from there!

[good3n]

@good3n If this is an issue, please open a new one and follow the template 😄 Happy to go from there!

Thanks, but no thanks! :)

[joshuaellis]

Well to answer your question, the implementation was completely wrong for v9.

Here's an updated sandbox for you to check out – https://codesandbox.io/s/toggle-react-spring-transition-forked-4zyp7?file=/src/App.js

Hopefully now you won't have any issue updating to v9

[alexandrudanpop]

I'm having the same issue even when applying the v9 transitions format.