react-overlays
react-overlays copied to clipboard
ownerDocument throws when server rendering
This library makes use of the ownerDocument tool:
import ownerDocument from 'dom-helpers/ownerDocument';
This tool will throw when called on the server since it accesses the document object which does not exist on the server.
This is causing our server to 500 Internal Server Error when trying to server render a page with a react-big-calendar component. The full stack trace is:
ReferenceError: document is not defined (Most recent call first)
at ownerDocument (D:\home\site\wwwroot\node_modules\react-big-calendar\node_modules\react-overlays\node_modules\dom-helpers\ownerDocument.js line 7 col 39)
at resolveRef (D:\home\site\wwwroot\node_modules\react-big-calendar\node_modules\react-overlays\cjs\utils\useWaitForDOMRef.js line 13 col 56)
at <unknown> (D:\home\site\wwwroot\node_modules\react-big-calendar\node_modules\react-overlays\cjs\utils\useWaitForDOMRef.js line 22 col 11)
at ya (D:\home\site\wwwroot\node_modules\react-dom\cjs\react-dom-server.node.production.min.js line 26 col 263)
at Object.useState (D:\home\site\wwwroot\node_modules\react-dom\cjs\react-dom-server.node.production.min.js line 29 col 81)
at useState (D:\home\site\wwwroot\node_modules\react\cjs\react.production.min.js line 23 col 311)
at useWaitForDOMRef (D:\home\site\wwwroot\node_modules\react-big-calendar\node_modules\react-overlays\cjs\utils\useWaitForDOMRef.js line 21 col 38)
at Object.render (D:\home\site\wwwroot\node_modules\react-big-calendar\node_modules\react-overlays\cjs\Overlay.js line 53 col 51)
at a.render (D:\home\site\wwwroot\node_modules\react-dom\cjs\react-dom-server.node.production.min.js line 43 col 59)
at a.read (D:\home\site\wwwroot\node_modules\react-dom\cjs\react-dom-server.node.production.min.js line 41 col 57)
If this library intentionally does not support server-side rendering I will report this in react-big-calendar instead.
Where specifically is this getting called?
The call stack is (links to calling line):
interesting...the usages here in useWaitForDOMRef seem properly guarded unless i'm missing something: https://github.com/react-bootstrap/react-overlays/blob/24f7f518390f055c8832a4f61b9c2e62af511649/src/utils/useWaitForDOMRef.js#L5
I'm not sure either (or I would have sent a PR heh). It seems safe to me. It's unclear how it could pass that check and then fail.
I haven't seen additional errors come in so it doesn't seem to happen consistently. I will report back if we see another one of these, and I'll try and get some server diagnostics if it happens again.