Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: selectAll causes an unexpected newline when pasting #6165

Open
1 task done
hustle-dev opened this issue Mar 7, 2025 · 4 comments
Open
1 task done

[Bug]: selectAll causes an unexpected newline when pasting #6165

hustle-dev opened this issue Mar 7, 2025 · 4 comments
Labels
Category: Open Source The issue or pull reuqest is related to the open source packages of Tiptap. Type: Bug The issue or pullrequest is related to a bug

Comments

@hustle-dev
Copy link

hustle-dev commented Mar 7, 2025

Affected Packages

core

Version(s)

2.11.0

Bug Description

When using the selectAll command and pasting content, an unexpected newline is inserted. This seems to be caused by the selectAll implementation, which sets the selection to AllSelection but does not handle the paste behavior properly.

Steps to Reproduce:

  1. Execute editor.commands.selectAll().
  2. Copy the selected content.
  3. Paste the content back into the editor.
  4. Notice that an unintended newline appears.
2025-03-07.17.00.58.mov

Browser Used

Chrome

Code Example URL

No response

Expected Behavior

The pasted content should replace the selection without inserting an extra newline.

2025-03-07.17.02.54.mov

This is a tiptap example that works with code from the 2.10.4 version.

Additional Context (Optional)

The issue might stem from how AllSelection interacts with the transaction when pasting. It could be necessary to handle paste events explicitly or adjust the selection behavior.

This looks like an issue with the merged PRs and issues below.

#5900
#5516

Image

Dependency Updates

  • Yes, I've updated all my dependencies.
@hustle-dev hustle-dev added Category: Open Source The issue or pull reuqest is related to the open source packages of Tiptap. Type: Bug The issue or pullrequest is related to a bug labels Mar 7, 2025
@github-project-automation github-project-automation bot moved this to Needs Triage in Tiptap: Issues Mar 7, 2025
@guanriyue
Copy link
Contributor

I don't think this is a bug. When selecting all content, what you're actually selecting is the Paragraph itself, not just the text content of the Paragraph. When pasting, the content being pasted is also a Paragraph node, and clearly, a Paragraph node cannot nest inside another Paragraph node. Therefore, a new Paragraph node will be inserted at current position.

@hustle-dev
Copy link
Author

@guanriyue

I understand what you mean about it not being a bug.
What prompted me to raise this issue is that in most editors I use, such as github and hackMD, when I press Mod-a and paste, it pastes within the paragraph instead of opening a new one, and I took this as a natural behavior (although it's possible that the editors use internally at the above mentioned places behave differently).
So I guess the only way I can fix this to get the behavior I want is to either distribute a modified version of the core-side logic myself, or modify it with code controlled by the editor. Do you have a guide you can recommend?

@guanriyue
Copy link
Contributor

You can use editorOptions to disable the default shortcut settings and customize these actions. Alternatively, you can use transformPasted to handle pasted content for specific cases. Of course, there are other ways to solve this issue.

The following solution is an example that utilizes transformPasted to process the pasted content, specifically when the selected content consists of only one paragraph.

If I have time later, I will try to provide a CodeSandbox.

import { Extension } from '@tiptap/core';
import { Slice } from '@tiptap/pm/model';
import { Plugin } from '@tiptap/pm/state';

export const PasteParagraph = Extension.create({
  name: 'pasteParagraph',

  addProseMirrorPlugins() {
    return [
      new Plugin({
        props: {
          transformPasted: slice => {
            const content = slice.content;

            const isSingleParagraph =
              content.childCount === 1 &&
              content.firstChild?.type.name === 'paragraph';

            if (isSingleParagraph) {
              return new Slice(content, 1, 1);
            }

            return slice;
          },
        },
      }),
    ];
  },
});

@hustle-dev
Copy link
Author

Thank you for being kind enough to attach the code. I will try to create the desired requirement using the method you mentioned.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Category: Open Source The issue or pull reuqest is related to the open source packages of Tiptap. Type: Bug The issue or pullrequest is related to a bug
Projects
Status: Needs Triage
Development

No branches or pull requests

2 participants