React 18.2 not rendering spreadsheet component

[leerobert]

I'm able to properly render the spreadsheet in Next.js 12.2.5 / react 17.0.2 / react-dom 17.02 but when I bump react to 18.2 and react-dom to 18.2 with the same Next.js version I don't have the spreadsheet render at all.

Is react 18 not supported yet by the react components?

// basic `index.tsx` within pages/ for nextjs
import { SpreadsheetComponent } from "@syncfusion/ej2-react-spreadsheet";

export default () => {
  return (
    <SpreadsheetComponent allowOpen={true} openUrl="/api/spreadsheet/open" />
  );
};

[sangeetha-priya-M]

Hi Robert,

We have rendered the spreadsheet in react 18.2 version and the spreadsheet rendered properly in our end. Please find the link below.

Sample Link: https://stackblitz.com/edit/react-ts-zzjyje?file=index.tsx,package.json

Could you please check the above sample and replicate your issue in the above link and send back to us. Or else please share us the issue replicable sample. Based on that we will check and provide you a better solution quickly.

Regards,

Sangeetha M

[leerobert]

I figured it out. Strict mode breaks the rendering:

https://stackblitz.com/edit/nextjs-jj6w5b?file=next.config.js

If you disable the strict mode then it renders fine.

Perhaps just a note in the installation to be sure strict mode is not enabled for the component.

[Vasanth-3519]

Hi Robert,

We have checked your reported issue and created a local sample with the same set of codes that has been shared by you as online sample and while rendering no error has been noticed and the component has rendered properly. We hereby attached the local sample below for your kind reference and also we suspect the issue may arise due to any cache or may it be the issue in the online sample side. Kindly make a note of it.

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/React_18.2931248074.zip

If we misunderstood your reported issue we request you to replicate your issue in the sample attached so that we can provide better solution regarding. Kindly get back to us if you need further clarification.

Regards, Vasanth R

[syncsiva]

This issue has been closed due to no response from the original author. Please feel free to reopen, if you have more information that can help us investigate the issue further.