fix: handle flushSync error when remounting useEditor in React 19#7549
Open
bxff wants to merge 3 commits intoueberdosis:mainfrom
Open
fix: handle flushSync error when remounting useEditor in React 19#7549bxff wants to merge 3 commits intoueberdosis:mainfrom
bxff wants to merge 3 commits intoueberdosis:mainfrom
Conversation
🦋 Changeset detectedLatest commit: 7c1037b The changes in this PR will be included in the next version bump. This PR includes changesets to release 72 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
✅ Deploy Preview for tiptap-embed ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
bxff
force-pushed
the
fix/flushsync-react19-remount
branch
from
9f9716b to
5eda073
Compare
Wraps the flushSync call in ReactRenderer's constructor with a try-catch. When flushSync throws (because React is already in a render/commit phase), it falls back to queueMicrotask — the same path already used for non-initialized editors. Closes ueberdosis#7543
bxff
force-pushed
the
fix/flushsync-react19-remount
branch
from
5eda073 to
0f34655
Compare
bdbch
requested changes
Apr 2, 2026
Member
bdbch
left a comment
bdbch
left a comment
There was a problem hiding this comment.
Thanks for the PR and for digging into the React 19 remount case. I'm going to reject this as-is because the new try/catch is a bit too broad: it doesn't just catch the flushSync lifecycle error, it will also swallow real errors thrown by this.render() and then retry them in a microtask. That changes the current failure mode, makes debugging harder, and could hide unrelated regressions.
I think this needs to be narrowed so we only fall back for the specific flushSync-during-render/commit failure, while rethrowing everything else. A focused test for that fallback path would also help a lot.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
Closes #7543
What this PR does
Wraps the
flushSynccall inReactRenderer's constructor with a try-catch. WhenflushSyncthrows (because React is already in a render/commit phase), it falls back toqueueMicrotask— the same path already used for non-initialized editors.flushSyncsucceeds → synchronous ProseMirror/React rendering (no behavior change)flushSyncthrows → graceful fallback to async renderWhy
React 19 may remount keyed components when a list is reordered, even with stable keys. When this happens during
useEditor's effect cycle,ReactRenderergets constructed during React's commit phase, andflushSyncthrows a hard error.Reproduction
Reporter's React 19 sandbox: https://codesandbox.io/p/sandbox/tiptap-flushsync-reorder-19-x47nq7
React 18 comparison (works fine): https://codesandbox.io/p/sandbox/tiptap-flushsync-reorder-18-w7ttcg