Skip to content

fix: Editor re-render on mount#2619

Open
matthewlipski wants to merge 1 commit intomainfrom
rerender-on-mount
Open

fix: Editor re-render on mount#2619
matthewlipski wants to merge 1 commit intomainfrom
rerender-on-mount

Conversation

@matthewlipski
Copy link
Copy Markdown
Collaborator

@matthewlipski matthewlipski commented Apr 2, 2026

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
Copy link
Copy Markdown

vercel bot commented Apr 2, 2026

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

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

Request Review

@matthewlipski matthewlipski requested a review from nperez0111 April 2, 2026 12:23
@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Apr 2, 2026

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

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Link: no menu appears on hover

1 participant