BlockNote icon indicating copy to clipboard operation
BlockNote copied to clipboard

editor.IsEditable returns true for custom blocks when editable is set to false

Open jacke99 opened this issue 11 months ago • 3 comments

After the latest update editor.isEditable seem to always returns true for my custom blocks. I have added some conditional behavior for my custom blocks depending on whether the editor is editable or not. After the latest update the condition that triggers when the editor is in edit mode is always active.

I tried making a copy of the default image block and just logged the editor.isEditable in the render function while the block is being used in a non editable editor. Which returned true.

jacke99 avatar Mar 03 '25 09:03 jacke99

@jacke99 is this still an issue? I see you closed https://github.com/TypeCellOS/BlockNote/issues/1476

YousefED avatar Mar 03 '25 10:03 YousefED

Yes, thought I fixed it and closed the other one but the issue is still present.

jacke99 avatar Mar 03 '25 12:03 jacke99

I've done some testing and it seems to only affect blocks built like this. When using a block built like the alert block, editor.isEditable returns false when editable is false, as expected.

jacke99 avatar Mar 10 '25 14:03 jacke99

Ah, this issue is caused because BlockNoteView is rendered using React whereas blocks like the image are rendered using vanilla JS. When you pass editable to BlockNoteView, it only sets editor.isEditable to that value on the initial render in a useEffect. So during the initial render, because the image is not rendered within React, it doesn't wait for this to happen and so the default value of editor.isEditable is used, which is true.

I'll see if this is fixable, but in the meantime there is an admittedly hacky workaround of re-checking the value of editor.isEditable in a short timeout and modifying the rendered dom element accordingly.

matthewlipski avatar Aug 06 '25 22:08 matthewlipski