We have updated WebDataRocks EULA, effective as of April 18, 2024. Learn more about what's changed.

React: dispose() crashes when multiple instances of WebDataRocks are present

Answered

Hello,
While using the library in React, I found that when I have multiple instances of WebDataRocks displaying different information and I call dispose() in all of them (e.g. when I move to another Route and everything is unmounted), the first instance would dispose correctly, but the next ones throw a fatal error:

TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.
at F3g.stopListener (webdatarocks.js:5)
at F3g.dispose (webdatarocks.js:5)
at c7j.dispose (webdatarocks.js:5)
at x4s.dispose (webdatarocks.js:5)
at Object.PivotApi.r3s.dispose (webdatarocks.js:5)
at Pivot.disposeWebDataRocks (webdatarocks.react.tsx:230) <-- My component's function called at componentWillUnmount()
at webdatarocks.react.tsx:199 <-- My component using new WebDataRocks({...})

I have followed the WebDataRocks integration with React available in GitHub: https://github.com/WebDataRocks/pivot-react
With only one instance everything works as expected. I added a try/catch block in the dispose() call to avoid crashing the application, and I have observed in the Chrome Developer Tools in the Performance monitor that it seems there are no memory leaks even though dispose() is failing, but not calling dispose() will leave memory leaks, so that’s not an option.
Is there something I can do? Maybe there’s another integration that solves this problem or a ready-to-use React component I didn’t find: From the docs ( https://www.webdatarocks.com/doc/integration-with-react/ ) I saw there’s a <WebDataRocksReact.Pivot>, but I cannot find it anywhere, neither the type definitions (I’m working in Typescript too).
Thank you very much for your help.

2 answers

WebDataRocks Team WebDataRocks March 2, 2020

Hello, Carlos,
 
Thank you for reporting about the problem
 
We did manage to reproduce the issue on our side.
 
Our team will consider it while releasing the next version of the component. However, we are not ready to provide you with an exact ETA with it.
 
Meanwhile, you can try Flexmonster Pivot, which is the premium product developed by the same team. Flexmonster receives minor updates every two weeks and provides release notes, improved support, and exclusive features for clients.
 
Please contact us in case additional questions occur.
 
Kind regards,
WebDataRocks Team

Carlos March 2, 2020

Thank you very much for your response. I will be watching for the next release that solves the problem.
Right now (and for the rest that found this same issue), the workaround is to surround the dispose() call with a try/catch block and ignore the error as it seems that neither crashes the app nor leaves memory leaks, but it’s never pleasant to have errors in the app.
Thanks again.