Rank 4
Bronze
Iron
Iron
Seeing this bug locally, and was able to reproduce it in CodeSandbox:
- Open this demo in CodeSandbox https://www.telerik.com/kendo-react-ui/components/grid/pdf-export/#toc-getting-started (original sandbox link: https://codesandbox.io/p/sandbox/proud-snow-z89k2q?)
- Ensure Dependencies includes React 18
- Make these changes to the bottom of main.jsx:
- Comment out this line:
ReactDOM.render(<App />, document.querySelector('my-app'));
- Add these three lines in place of the above one:
const container = document.querySelector('my-app');
const root = createRoot(container); // createRoot(container!) if you use TypeScript
root.render(<App />);
A finished Sandbox in case it saves you some time -- https://stackblitz.com/edit/react-epnjnd?file=app%2Fmain.jsx
- Notice that the first sandbox on page load gives the React 17/18 react-dom.render() issue. In contrast, the finished sandbox doesn't give the React 17/18 issue. This behavior is to be expected.
- Click on "Export PDF" button. You now get the React 17/18 error on both sandboxes. You'd expect the error not to show up on the finished sandbox, as the parent code no longer utilizes the "old way of rendering React".
1 Answer, 1 is accepted
Hi, Janki,
Thank you so much for reporting this bug, and for listing the steps to reproduce.
I checked the source code and I could see that we are using `ReactDOM.render` internally in two places. This needs to be changed to `createRoot` since `ReactDOM.render` is deprecated.
I logged an internal issue for this and we will directly fix this bug as it does not require many changes. Apologies for the inconvenience it has caused you.
In addition, I updated your Telerik Points accordingly as a small token of gratitude for your report.
Regards,
Wissam
Progress Telerik
Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!
Rank 4
Bronze
Iron
Iron
Thank you, Wissam, for your speedy help with this!
When you say "we will directly fix this bug as it does not require many changes", do you mean that we don't have to upgrade our Kendo packages to get this fix into our apps? Ultimately, I just want to make sure we incorporate this bug fix on our side! I hope this question makes sense - I'm not super familiar with how the npm ecosystem works at that granular of a level.
Thank you,
Janki
Hi, Janki,
Usually, after logging a bug we add it to the planning based on its severity and how many times it is reported. I meant that we will add the fix directly without the need to plan this bug.
As for the NPM ecosystem, the bug fix will be included in a newer version of the package. For convenience, I logged a public issue that you can subscribe to. When the bug if fixed and released, we will add a comment to the item mentioning the exact package version where the bug fix is present. You can track it here:
If you have any further questions, please let me know.
Regards,
Wissam
Progress Telerik
Hi, Rajiv,
Can you please provide me with a simple project where this issue is present since I could not reproduce this?
In addition, please tell me if you are using NPM or Yarn, and the version of the KendoReact Grid that you are using.
I would highly suggest creating a separate forum thread or submitting a support ticket in order to keep the information consistent and be able to assist you in a quicker manner:
After this send me the new forum or ticket ID here and I will be glad to handle it.
Regards,Wissam
Progress Telerik