Paste in code block don't work properly

[jdauphant-dinum]

Describe the bug
I copy a code, I create a code block, I paste : only the first line is in the code block, the rest is outside the code block.

To Reproduce

• copy a code (with ``` and enter)
• create a code block
• paste into the code block

Bug.TypeCell.mp4

I have tested on the website and on docs.numerique.gouv.fr .

Misc

• Node version:
• Package manager:
• Browser: Brave Version 1.77.95 Chromium: 135.0.7049.52 (Official Build) (arm64) / Firefox 137.0 (aarch64)
• I'm a sponsor and would appreciate if you could look into this sooner than later 💖

[mxthxngx]

Any update on this? @jdauphant-dinum Facing the same issue! Is there any workaround for now? (Absolutely love the product btw)

[mxthxngx]

Just a heads-up for anyone facing similar issues — I found a workaround for pasting code by implementing a custom pasteHandler.

In my case, the clipboard content wasn’t being detected as "text/markdown", so I switched to checking for "text/plain" instead. Everything else remains the same and works as expected. If "text/markdown" works for you, feel free to adjust the condition.

Here’s the snippet:

   pasteHandler: ({ event, editor, defaultPasteHandler }) => {
                    if (event.clipboardData?.types.includes("text/plain")) {
                        (async () => {
                            const cursor = editor.getTextCursorPosition();
                            console.log("Cursor", cursor.block.type);
                            let data = await navigator.clipboard.readText();

                            if (cursor.block.type === "codeBlock") {
                                data = `\`\`\`\n${data}\n\`\`\``;
                            }
                            const markdownTextBlock = await editor.tryParseMarkdownToBlocks(
                                data
                            );
                            editor.insertBlocks(markdownTextBlock, cursor.block);
                            editor.removeBlocks([cursor.block]);
                        })();
                        return true;
                    }
                    return defaultPasteHandler();
                },

Hope this helps!

[matthewlipski]

By default, BlockNote will attempt to parse text/plain content from the clipboard if it detects Markdown. When copying the raw file from GitHub, this puts only text/plain on the clipboard, which then gets parsed as Markdown due to things like comments beginning with a # character like Markdown headers do.

In order to disable parsing text/plain as Markdown on paste events, you can add the following editor option:

const editor = useCreateBlockNote({
  pasteHandler: ({ defaultPasteHandler }) =>
    defaultPasteHandler({
      plainTextAsMarkdown: false,
    }),
});

In cases where there is text/html or text/markdown also on the clipboard, you can use Cmd+Shift+V or right click and select "Paste and Match Style" (Ctrl+Shift+V or "Paste as plain text" on Windows) to paste the text/plain instead of the richer formats.

[nperez0111]

@matthewlipski I think there is something to be said here about having a more context-aware default paste handler. Like if we currently are within a code-block, it should only ever paste the text/plain mimetype as that is the only one which is valid in the current context.

[matthewlipski]

@nperez0111 ah that's a good point actually. Imo makes sense to force pasting plain text for probably code, quote, table, and custom blocks. Meanwhile paragraphs, headings, and list items would accept rich clipboard content. Wdyt?

[nperez0111]

I'd probably only special case code specifically to only paste as text/plain. Since the others can still be formatted in some way. Only code cannot be formatted at all.

The others are more about whether multi-line content is accepted which I think is separate than this.