5

I am facing some errors while rendering at SSR for some URL using renderToString from "react-dom/server"

I am getting following error:

TypeError: Cannot read property 'length' of undefined
at areHookInputsEqual (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:992:38)
at Object.useMemo (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:1230:13)
at useMemo (C:\projects\spd-web-app1\node_modules\react\cjs\react.development.js:1521:21)
at Provider (C:\projects\spd-web-app1\node_modules\react-redux\lib\components\Provider.js:22:41)
at finishHooks (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:1077:16)
at processChild (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:3046:14)
at resolve (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:2962:5)
at ReactDOMServerRenderer.render (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:3437:22)
at ReactDOMServerRenderer.read (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:3375:29)
at renderToString (C:\projects\spd-web-app1\node_modules\react-dom\cjs\react-dom-server.node.development.js:3990:27)

What i found is,in react-dom-server.node.development.jscreateWorkInProgressHook()

I am getting below object, in which memoizedState is not an array.

{
  memoizedState: 0,
  queue: { last: null, dispatch: [Function: bound dispatchAction] },
  next: {
    memoizedState: { current: [QueryData] },
    queue: null,
    next: { memoizedState: [Object], queue: null, next: [Object] }
  }
}

which when used in useMemo() var prevDeps = prevState[1]; will return undefined and thus causing issue in areHookInputsEqual()

I am not sure what could have gone wrong, so do not have a code to share.

  • Can you include your useMemo code? It looks like based on the error, you aren't setting the dependency array as an array (likely the undefined value you mentioned previously) – Zachary Haber Oct 20 '20 at 13:07

1 Answers1

3

I've seen this happening when a hook was using after a conditional statement. Moving the hook usage above the conditional statement fixed the problem.

Reference: https://reactjs.org/docs/hooks-rules.html

fpintos
  • 151
  • 8