tiptap: PasteRule does not work for nodes
Describe the bug
When attempting to add a pasteRule for a Node, it does not work as the pasteRule helper function have a call to a Mark node (note how we call addToSet on the created node, which may not be a mark but a node):
nodes.push(child.cut(start, end).mark(type.create(attrs).addToSet(child.marks)));
Steps to Reproduce / Codesandbox Example
- Add a paste rule to any node such as a media embed
pasteRules({type}) {
return [pasteRule(/SOME_YOUTUBE_REGEX/g, type, (url) => ({src: url}))]
}
- try to paste a heading:
https://www.youtube.com/watch?v=H08tGjXNHO4 - See error in console:
Uncaught TypeError: type.create(...).addToSet is not a function
Expected behavior
a new MediaEmbed node should be created with the given attrs
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Reactions: 6
- Comments: 22 (19 by maintainers)
I’m also facing issue w/ implementing a nodePasteRule and wondered if anyone has gotten something similar to @kfirba solution working w/ TipTap 2 and the addPasteRules method? So far I’ve tried altering the code shown to accept a config object rather than just arguments to be closer to the TipTap nodeInputRule & markPasteRule, but I’m getting
Uncaught TypeError: find is not a function. Thanks for making TipTap and any further suggestions.@philippkuehn I’ve created a simple helper function to solve that:
Basically it is a very similar function as
markPasteRulebut it just creates the node with the given attribute instead of trying to add a mark ~and does not contain awhileloop. Even in themarkPasteRuleI’m not sure why there is awhileloop whenmatchis only every assigned once?~ It seems like thewhileloop is for theregexp.execcall due to it attempting to match from thelastIndex: https://stackoverflow.com/questions/1520800/why-does-a-regexp-with-global-flag-give-wrong-resultsI guess that if you want you could extract the common logic between those 2 methods and just pass a handler to create the node/mark.
What do you think?
@hanspagel any direction on where to look if one wants to implement embeds on paste today? thanks!
@Alecyrus I think you get an endless loop as you didn’t provide the
gflag for your regex. Try replacing your regex to this:Can you show some input => output example?
Also, if you could provide a reproduction it would be best.