Skip to content

Updating useEditor deps causes useEditorState selectors to run with an uninitialized editor #7346

@ColonelThirtyTwo

Description

@ColonelThirtyTwo

Affected Packages

core

Version(s)

3.13.0

Bug Description

Passing in different deps or extensions to the useEditor hook will cause any selectors registered with useEditorState to run on the old, deinitialized editor, leading to errors (usually about the editor being unmounted, ex. [tiptap error]: The editor view is not available. Cannot access view['hasFocus']. The editor may not be mounted yet.)

The selectors are called with an editor with editorView: null and isInitialized: False once the deps change, which causes some methods to throw exceptions (like focus() above). The selector hook can be written to check isInitialized, but it's boilerplate and not obvious from the docs that this is something that should be done.

The selectors don't seem to be called if the component running the useEditor hook is destroyed - only changing the deps or extensions triggers the issue.

Browser Used

Firefox

Code Example URL

https://codesandbox.io/p/devbox/fervent-bogdan-r6d225?workspaceId=ws_L2aTwPoYYndwTCpLs2bWEe

Expected Behavior

Clicking the "Change Deps" button, which increments a counter passed to the deps argument of useEditor, should not cause a rendering error.

Additional Context (Optional)

No response

Dependency Updates

  • Yes, I've updated all my dependencies.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Open SourceThe issue or pull reuqest is related to the open source packages of Tiptap.

    Type

    No fields configured for Bug.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions