Skip to content

Fix: ensure tools are configured before editor renders on note switch - #355

Open
7eliassen wants to merge 5 commits into
mainfrom
fix/editor-block-displaying
Open

Fix: ensure tools are configured before editor renders on note switch#355
7eliassen wants to merge 5 commits into
mainfrom
fix/editor-block-displaying

Conversation

@7eliassen

@7eliassen 7eliassen commented Jul 8, 2026

Copy link
Copy Markdown
Contributor

Problem:

image Occasionally, when switching between notes, some editor.js blocks may not be displayed correctly.

Root Cause:

image *toolsUserConfigLoaded and isEditorReady already true when the function is just called*

This issue occurs because the toolsUserConfigLoaded and isEditorReady flags are not properly reset. As a result, the editor may render before the tools are fully configured, causing certain blocks to fail to display.

What done:

  • Added logic to reset toolsUserConfigLoaded and isEditorReady before calling loadToolsScripts, ensuring that the editor waits for the tools to be properly configured before rendering.
  • Destroy the editor reliably on unmount to prevent bug (screenshot bellow) when the previous editor instance wasn't cleaned up.
image
  • Added a load counter to discard stale async results and prevent race conditions during rapid note switching.

@vercel

vercel Bot commented Jul 8, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated (UTC)
codex-ui Ready Ready Preview, Comment Jul 27, 2026 5:33pm

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses an intermittent Editor.js rendering issue when switching between notes by ensuring the editor does not render until tool scripts/configuration have been rebuilt for the newly selected note.

Changes:

  • Reset isEditorReady and toolsUserConfigLoaded before re-loading tool scripts on noteAndUserTools changes.
  • Ensure the editor component remounts only after tools are configured, preventing blocks from rendering with stale/missing tool configuration.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/application/services/useNoteEditor.ts Outdated
Comment on lines 147 to 150
isEditorReady.value = false;
toolsUserConfigLoaded.value = false;

await loadToolsScripts(tools);
isEditorReady.value = false;
toolsUserConfigLoaded.value = false;

const loadedConfig = await loadToolsScripts(tools);

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

loadToolsScripts can throw. Since isEditorReady is now reset to false before this await, a failed download leaves the note stuck with no editor rendered at all.

Might be worth wrapping this in a try/catch and surfacing an error on failure? Or maybe restoring some usable state?

* If a newer load request has superseded this one — discard stale results
* to prevent overwriting state with tools from a previous note.
*/
if (loadId !== currentLoadId) {

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you add test case so the race condition this is meant to fix doesn't regress silently?

await loadToolsScripts(tools);
const loadId = ++currentLoadId;

isEditorReady.value = false;

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

isEditorReady now resets on every noteAndUserTools recompute, not just on note switch — e.g. installing a tool from the marketplace live-updates the shared userEditorTools ref while a note is open. Worth checking that case: does <Editor> visibly flash/remount instead of just picking up the new tool like before?

* @returns loaded tools config
*/
async function loadToolsScripts(toolsConfigs: EditorTool[]): Promise<void> {
async function loadToolsScripts(toolsConfigs: EditorTool[]): Promise<Record<string, { class: EditorjsConfigTool; inlineToolbar: boolean }>> {

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Might be worth extracting a shared type alias so loadToolsScripts and toolsUserConfig can't drift apart?

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.

3 participants