fix: Editor re-render on mount

[matthewlipski]

Summary

This PR makes the editor container component re-render when the editor view is mounted. This fixes certain cases where descendants rely on editor.domElement to be defined. However, when it becomes defined, there is nothing which explicitly triggers a re-render, meaning things like event listeners may not get attached until some other unrelated effect triggers a re-render.

Closes #2546

Rationale

See above.

Changes

• Made BlockNoteEditor onMount and onUnmount return callbacks to destroy the listeners.
• Made BlockNoteViewComponent force a re-render when the TipTap editor's create event fires.

Impact

N/A

Testing

I wasn't able to reproduce the issue in #2546 locally, and have not seen other cases of this elsewhere. Therefore, no tests have been added.

Screenshots/Video

N/A

Checklist

• Code follows the project's coding standards.
• Unit tests covering the new feature have been added.
• All existing tests pass.
• The documentation has been updated to reflect the new feature

Additional Notes

Summary by CodeRabbit

Release Notes

• Bug Fixes
  • Fixed mount and unmount lifecycle event handlers to properly return unsubscribe functions, enabling better control over event subscriptions.
  • Improved editor rendering synchronization to ensure the UI updates correctly when the editor becomes available.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
blocknote	Error		Apr 2, 2026 0:23am
blocknote-website	Ready	Preview	Apr 2, 2026 0:23am

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: cdf0d3f2-674c-4af0-9e68-15cb93a9ca8f

📥 Commits

Reviewing files that changed from the base of the PR and between 07df972 and 58457e2.

📒 Files selected for processing (2)

• packages/core/src/editor/BlockNoteEditor.ts
• packages/react/src/editor/BlockNoteView.tsx

---

📝 Walkthrough

Walkthrough

Modified BlockNoteEditor.onMount and onUnmount methods to return EventManager subscription results instead of void, and added mount-state tracking to React's BlockNoteView component to synchronize editor readiness with component initialization.

Changes

Cohort / File(s)	Summary
BlockNoteEditor Event Returns packages/core/src/editor/BlockNoteEditor.ts	Updated onMount and onUnmount methods to return EventManager subscription results, enabling callers to handle unsubscription/cleanup functions.
React BlockNoteView Mount Synchronization packages/react/src/editor/BlockNoteView.tsx	Added setMounted state and useEffect hook that subscribes to TipTap's "create" event, ensuring component children render only when editor.domElement is available.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Poem

🐰 The editor now speaks its truths so clear,
When mounted events finally appear!
No more waiting in hover's haze,
Links bloom brightly through the maze. ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'fix: Editor re-render on mount' accurately and concisely describes the main change—forcing a re-render when the editor mounts to ensure editor.domElement is available to dependent components.
Description check	✅ Passed	The description covers the summary, rationale, changes, impact, testing, and checklist, following the template structure. However, the Testing section states no tests were added despite the checklist claiming unit tests were added.
Linked Issues check	✅ Passed	The PR addresses the root cause identified in issue #2546 by ensuring editor.domElement is available when the editor mounts, allowing descendants to attach event listeners promptly.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to fixing the editor re-render issue: returning callbacks from onMount/onUnmount and triggering re-render on the TipTap create event, with no unrelated modifications.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch rerender-on-mount

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[nperez0111]

I'd really prefer not to do this if at all possible. This causes jank for everyone else. I'd prefer something at the read-side (e.g. making the reading of the domElement reactive, or making the component that needs this element on render to remount). But remounting the whole editor is way too much

[nperez0111]

I'd prefer a different solution here, this is too much. Especially for an issue we can't reliably reproduce