diff --git a/demos/src/Marks/Link/React/index.jsx b/demos/src/Marks/Link/React/index.jsx index 53b3134a93f..255a203a3fe 100644 --- a/demos/src/Marks/Link/React/index.jsx +++ b/demos/src/Marks/Link/React/index.jsx @@ -1,5 +1,6 @@ import './styles.scss' +import Bold from '@tiptap/extension-bold' import Code from '@tiptap/extension-code' import Document from '@tiptap/extension-document' import Link from '@tiptap/extension-link' @@ -15,13 +16,14 @@ export default () => { Paragraph, Text, Code, + Bold, Link.configure({ - openOnClick: false, + openOnClick: true, }), ], content: `
- Wow, this editor has support for links to the whole world wide web. We tested a lot of URLs and I think you can add *every URL* you want. Isn’t that cool? Let’s try another one! Yep, seems to work. + Wow, this editor has support for links to the whole world wide web. We tested a lot of URLs and I think you can add *every URL* you want. Isn’t that cool? Let’s try another one! Yep, seems to work.
By default every link will get a rel="noopener noreferrer nofollow"
attribute. It’s configurable though.
diff --git a/packages/extension-link/src/helpers/clickHandler.ts b/packages/extension-link/src/helpers/clickHandler.ts
index 23934f495e4..b2c4ce5fb76 100644
--- a/packages/extension-link/src/helpers/clickHandler.ts
+++ b/packages/extension-link/src/helpers/clickHandler.ts
@@ -15,9 +15,15 @@ export function clickHandler(options: ClickHandlerOptions): Plugin {
return false
}
- const eventTarget = event.target as HTMLElement
+ let a = event.target as HTMLElement
+ const els = []
- if (eventTarget.nodeName !== 'A') {
+ while (a.nodeName !== 'DIV') {
+ els.push(a)
+ a = a.parentNode as HTMLElement
+ }
+
+ if (!els.find(value => value.nodeName === 'A')) {
return false
}
@@ -28,9 +34,7 @@ export function clickHandler(options: ClickHandlerOptions): Plugin {
const target = link?.target ?? attrs.target
if (link && href) {
- if (view.editable) {
- window.open(href, target)
- }
+ window.open(href, target)
return true
}