ueberdosis / tiptap

The headless rich text editor framework for web artisans.
https://tiptap.dev
MIT License
26.73k stars 2.23k forks source link

[Bug]: extension-link: multiple tabs are opened when click anchor link in readonly editor #4143

Open takaaa220 opened 1 year ago

takaaa220 commented 1 year ago

Which packages did you experience the bug in?

extension-link

What Tiptap version are you using?

2.0.0-beta.220

What’s the bug you are facing?

Multiple tabs are opened when click anchor link in readonly editor (editor.editable is set to false). The behavior differs depending on the browser and OS, but when using Firefox and MacOS, it looks like this video.

https://github.com/ueberdosis/tiptap/assets/25857381/80c3cab5-9cee-44e3-b69e-20a40a9855c8

What browser are you using?

Firefox

Code example

https://codesandbox.io/s/zealous-taussig-px4w3y

What did you expect to happen?

Only one tab is opened when click anchor link.

Anything to add? (optional)

I think it would to return false if view.editable is false at here, but I'm not familiar with the internal implementation of tiptap, so I'm not sure.

Did you update your dependencies?

Are you sponsoring us?

takaaa220 commented 1 year ago

I found a related pull request https://github.com/ueberdosis/tiptap/pull/3312 but it seems there is no progress 😢

dragosdev-code commented 1 year ago

I have the same issue, but I got it to work disabling the openOnClick property when I set the editor to be not editable.

type Props = {
  readOnly?: boolean;
};

const RichTextEditor: React.FC<Props> = ({
  readOnly,
}) => {
  const editor = useEditor({
    extensions: [
      Link.configure({
        openOnClick: !readOnly,
      }),    
    ],
    editable: !readOnly,
    // ...rest of the configuration
  });

  return (
      <EditorContent
        className={classes.editorContent}
        editor={editor}
      />
  );
};

However, if the changes from #3312 are implemented, it could be a little more elegant.

takaaa220 commented 1 year ago

I have the same issue, but I got it to work disabling the openOnClick property when I set the editor to be not editable.

Thanks for your sharing! I was able to resolve by that way.

However, if the changes from https://github.com/ueberdosis/tiptap/pull/3312 are implemented, it could be a little more elegant.

On second thought, #3312 doesn't solve my issue...

Nantris commented 1 year ago

I can't reproduce this with your repro on Chrome 115 on Linux, but I'd advise upgrading out of beta.

chaoyue-z-colab commented 6 months ago

i can still repro this but only on firefox with "@tiptap/extension-link": "^2.1.8". note, this only happen on firefox in read only editor.