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

Copying linked content from other rich text editors into the tiptap editor will treat the content following the link as a link #3893

Open
1 of 2 tasks
Chenchaoyang666 opened this issue Mar 28, 2023 · 14 comments
Labels
Category: Open Source The issue or pull reuqest is related to the open source packages of Tiptap. Info: Needs Reproduction The issue or pullrequest needs a reproduction before it can be worked on Type: Bug The issue or pullrequest is related to a bug

Comments

@Chenchaoyang666
Copy link

What’s the bug you are facing?

Copying linked content from other rich text editors into the tiptap editor will treat the content following the link as a link

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

Version 110.0.5481.100 (Official Version) (64-bit)

How can we reproduce the bug on our side?

Copying linked content from other rich text editors into the tiptap editor will treat the content following the link as a link,I think pasted content with a label should be processed first

Can you provide a CodeSandbox?

No response

What did you expect to happen?

If the attached content is labeled a, the link can be accessed normally

Anything to add? (optional)

No response

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. 💖
@Chenchaoyang666 Chenchaoyang666 added the Type: Bug The issue or pullrequest is related to a bug label Mar 28, 2023
@bdbch
Copy link
Member

bdbch commented Mar 28, 2023

Hey @Chenchaoyang666 just a few questions:

  1. Which richtext editor are you copying from? If it's Google Docs, could you verify if the "linked content" is actually a link or just a styled span.
  2. What kind of content are you copying? Could you add a small example to the issue so we can verify the issue?
  3. If possible, a codesandbox would be perfect. You can use this template if you want: https://codesandbox.io/s/tiptap-react-qidlsv

Thanks for your help.

@bdbch bdbch added Triage: Open A new issue or pullrequest that requires triage (added by default) Category: Open Source The issue or pull reuqest is related to the open source packages of Tiptap. labels Mar 29, 2023
@Chenchaoyang666
Copy link
Author

@Chenchaoyang666
Copy link
Author

Copy the following linked text from wangeditor into the tiptap editor:
Gitkraken破解方法:https://github.com/5cr1pt/GitCracken(拉取到本地,按步骤即可破解,亲测有效)/或者直接附件下载

@Chenchaoyang666
Copy link
Author

It seems that github has the same problem as tiptap

@bdbch
Copy link
Member

bdbch commented Mar 30, 2023

It seems like the parantheses ( and ) are weird in your text. I don't know if it's because of the chinese keyboard / layout / charset? Not very familiar on this topic, but it seems like those parantheses don't actually split the link from the text afterwards. See screenshots:

Bad parantheses (selected, there is no space before / after a parantheses)
image
image


Correct Pantheses (selected)
image

image

I guess that's why the text afterwards gets linked (since there is no actual space separating the text afterwards from the link).

Could you try replacing the parantheses from your copied text with those: ( and ) ?

@bdbch bdbch added Info: Needs Reproduction The issue or pullrequest needs a reproduction before it can be worked on and removed Triage: Open A new issue or pullrequest that requires triage (added by default) labels Mar 30, 2023
@ZowieTao
Copy link

I copy url from browser url input, and paste in editor, show slice info from handlePaste:
screenshot-20230519-175834

  1. use window 10, new edge browser:
    20230519-175904

this is page loaded and copy result, if page not loaded, get result same to macos.

  1. use macos, chrome:
    20230519-175858

@Nantris
Copy link
Contributor

Nantris commented May 20, 2023

@ZowieTao it's not clear why you shared those images. If there's a difference, please mention what it is.

@Nantris
Copy link
Contributor

Nantris commented Jul 18, 2023

This is really disruptive. Any update?

Copied content:

image

Pasted output:

image

@Nantris
Copy link
Contributor

Nantris commented Jul 27, 2023

The issue seems to occur because of these lines:

if (link && selection.empty) {
options.editor.commands.insertContent(`<a href="${link.href}">${link.href}</a>`)

@Nantris
Copy link
Contributor

Nantris commented Jul 27, 2023

The first bad commit is likely from this PR: #3975

TipTap 2.0.4 works fine and doesn't have this problem. Same with 2.1.0-rc.1, but 2.1.0-rc.2 exhibits the issue

@bdbch pinging you because it's your commit and I know these things tend to get harder to fix the longer that passes. It would be great if this could be resolved before the stable release of 2.1.0.

I'm not really sure what prior problem the lines I mentioned are intended to accomplish so I can't suggest any changes.

@bdbch bdbch added this to Tiptap Aug 4, 2023
@github-project-automation github-project-automation bot moved this to Triage open in Tiptap Aug 4, 2023
@bdbch
Copy link
Member

bdbch commented Aug 5, 2023

@slapbox could you explain exactly where you copied the content from? I tried to replicate it with a copied link + list - but it didn't break on my end.

Did you copy it from another editor or another tiptap instance?

@bdbch
Copy link
Member

bdbch commented Aug 5, 2023

@Chenchaoyang666 for the example you provided I determined the problem down to the character, which is not a normal parenthesis with a space, but a full-width parenthesis that does not include a space before.

image

Same with the commas which are full width commands (without spaces)

image

Are those characters usually used in chinese? If so I can't really help here and would require help from a chinese developer as I can't test this accordingly.

@bdbch
Copy link
Member

bdbch commented Aug 5, 2023

Problem is - we're using linkify to find links inside text and will use the link length + the link offset to add a mark for the link. Because your link does technically not have spaces, linkify takes everything as a link.

@Nantris
Copy link
Contributor

Nantris commented Aug 5, 2023

@bdbch thanks for looking into this. I copied the content from the same TipTap editor instance to produce my screenshot.

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. Info: Needs Reproduction The issue or pullrequest needs a reproduction before it can be worked on Type: Bug The issue or pullrequest is related to a bug
Projects
No open projects
Status: Triage open
Development

No branches or pull requests

4 participants