Ketcher-React and Next.js Compatibility Issue: 'window is not defined' Error during Server-Side Rendering

[vishalmoltech]

Encountering an unhandledRejection error with the message 'ReferenceError: window is not defined' when attempting to render the Ketcher-React editor on the server side with Next.js. The error originates from the 'raphael.min.js' file, leading to potential compatibility issues between Ketcher-React and Next.js. Seeking guidance and solutions this error and ensure smooth integration between the two technologies. Any insights or suggestions on resolving this issue would be greatly appreciated.

[vishalmoltech]

I've made numerous attempts to resolve the 'window is not defined' error by setting Server Side Rendering (SSR) to false. Despite multiple efforts, including version changes, the issue persists. I expected that by disabling SSR, the Ketcher-React editor would render without encountering the mentioned error. However, the problem remains unresolved.

[ForumT]

Hi any updates on this one?

[alsersan]

I faced the same problem, and what I did is to lazy load my Ketcher component (which is just a wrapper component around Ketcher itself, where I initialize various things). I used React's "lazy" mainly because I wanted to have control over what the Suspense boundary was, but it also works fine with Next's dynamic import with SSR set to false