Follow @Tirokk's review and fix a bug

The bug happened because the hashtag link won't get parsed by the
extension. This is desired for mentions because you don't want to
re-notify a user if you haven't updated the text in which you notify
somebody. For hashtags this is undesired and would lead to transforming
the hashtag link into a normal link on the next edit of a post.
This commit is contained in:
roschaefer 2019-09-17 11:05:45 +02:00
parent b509a224ce
commit 2f90a45da7
4 changed files with 20 additions and 5 deletions

View File

@ -4,6 +4,7 @@
<script>
import defaultExtensions from './defaultExtensions.js'
import Hashtag from './nodes/Hashtag.js'
import { Editor, EditorContent } from 'tiptap'
export default {
@ -21,7 +22,12 @@ export default {
doc: this.doc,
content: this.content,
editable: false,
extensions: defaultExtensions(this),
extensions: [
// Hashtags must come first, see
// https://github.com/scrumpy/tiptap/issues/421#issuecomment-523037460
new Hashtag(),
...defaultExtensions(this),
],
}),
}
},

View File

@ -134,10 +134,12 @@ export default {
content: this.value || '',
doc: this.doc,
extensions: [
// Hashtags must come first, see
// https://github.com/scrumpy/tiptap/issues/421#issuecomment-523037460
...this.optionalExtensions,
...defaultExtensions(this),
new EventHandler(),
new History(),
...this.optionalExtensions,
],
onUpdate: e => {
clearTimeout(throttleInputEvent)

View File

@ -37,8 +37,14 @@ export default class Hashtag extends TipTapMention {
]
},
parseDOM: [
// simply don't parse mentions from html
// just treat them as normal links
{
tag: 'a[data-hashtag-id]',
getAttrs: dom => {
const id = dom.getAttribute('data-hashtag-id')
const label = dom.innerText.split(this.options.matcher.char).join('')
return { id, label }
},
},
],
}
}

View File

@ -15,7 +15,8 @@ export default class Link extends TipTapLink {
inclusive: false,
parseDOM: [
{
tag: 'a[href]:not(.embed)', // do not trigger on embed links
// if this is an embed link or a hashtag, ignore
tag: 'a[href]:not(.embed):not([data-hashtag-id])',
getAttrs: dom => ({
href: dom.getAttribute('href'),
}),