Inserting a block node as first node marks it as selected (adding nodes afterwards deletes the block node)

[mejo-]

What’s the bug you are facing?

When inserting a block node as first node into an empty editor using `insertContent(), the inserted node is marked as selected (focused) afterwards. The result is that insertions happening directly after the first one overwrite the content of the first one.

Interestingly, this only happens on empty content. As soon as the editor has some content, the bug is no longer reproducible.

I tested this with block nodes of type horizontalRule and image.

Which browser was this experienced in? Are any special extensions installed?

Latest Firefox and Chromium.

How can we reproduce the bug on our side?

Doing the following on editor with empty content will insert a horizontal line, mark it as selected and overwrite it with the text 'abc' afterwards:

this.editor = new Editor({ extensions: [ StarterKit ] });
this.editor.chain().insertContent({ type: 'horizontalRule' }).insertContent("abc").focus().run();

Can you provide a CodeSandbox?

https://codesandbox.io/s/tiptap-block-node-bug-1cetce?file=/src/App.vue

What did you expect to happen?

The second insertContent() should append content after the first one instead of replacing it.

Anything to add? (optional)

Seems like tr.replaceWith() in insertContentAt() results in the new content being marked as selected in some cases.

Did you update your dependencies?

• Yes, I’ve updated my dependencies to use the latest version of all packages.

Are you sponsoring us?

• Yes, I’m a sponsor. 💖

[mejo-]

It's possible to workaround this bug by adding selectTextblockEnd() in the command chain after the first insertContent(). E.g.:

this.editor.chain().insertContent({ type: 'horizontalRule' }).selectTextblockEnd().insertContent("abc").focus().run();

[mejo-]

Well, turned out that selectTextblockEnd() didn't work as expected. What works though, is placing the cursor to the end of selection in case there's a non-empty selection range after adding the content:

this.editor.commands.insertContent({ type: 'horizontalRule' })
if (!this.editor.view.state.selection.empty) {
    this.editor.chain().focus(this.editor.view.state.selection.to).insertContent("abc").focus().run()
}

[github-actions]

This issue is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 7 days

[mejo-]

The issue unfortunately still exists.

[github-actions]

This issue is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 7 days

[mejo-]

Unfortunately this issue still exists. I fixed the codesandbox example (missing dependency on @tiptap/pm).