onReady is called after <CKEditor> is unmounted

[stonebk]

A bit of an edge case I ran into while testing. I have a component that looks something like this:

    const [editor, setEditor] = useState<HeadlessEditor>(); 
    const onReadyCallback = useCallback(
      (editor) => {
        setEditor(editor);
      },
      []
    );

    return <CKEditor config={config} editor={MyEditor} onReady={onReadyCallback}  />;

I have some small tests that run faster than it takes to initialize the editor, so <CkEditor> unmounts before onReady is called, but onReady is called anyways resulting in the following warning:

  console.error
    Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

My guess is that this is because the onReady call happens in a setTimeout:

				// The `onReady` callback should be fired once the `editor` property
				// can be reached from the `<CKEditor>` component.
				// Ideally this part should be moved to the watchdog item creator listeners.
				setTimeout( () => {
					if ( this.props.onReady ) {
						this.props.onReady( editor );
					}
				} );

Would be nice to not have to work around this!

[Mati365]

@stonebk Can you check if this issue is still reproducible? We managed to release few modifications in initialization mechanism and upgrading might solve the issue.

[stonebk]

@stonebk Can you check if this issue is still reproducible? We managed to release few modifications in initialization mechanism and upgrading might solve the issue.

I will take a look, thanks!

[stonebk]

@Mati365 yay! v7.0.0 looks to have fixed this!