#2912 - fix memory leak for ketcher when it is opened inside modal #3027
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
How the feature works? / How did you fix the issue?
(Screenshots, videos, or GIFs, if applicable)
The root cause is the Editor's div ref is initially used to create root in initApp.tsx, while this root did not get destoried when Editor unmount because the ref is an escape hatch in react, which are out of react's control.
The listeners are subscribed in this root, so they did not get unsubscribed.
The fix is to create the root in Editor and umount it manually when Editor get destoried, then react would take care of unmount all the components and removing event handlers or state in the tree.
Please refer to this branch for a modal example to reproduce this bug: 2912-bug-fix-memory-leak-for-ketcher-when-it-is-opened-inside-modal-1
and this branch for fix with the same modal
2912-example-fix-memory-leak-for-ketcher-when-it-is-opened-inside-modal-1
Check list
#1234 – issue name