search

ueberdosis / tiptap

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

Quilljs to TipTapNext - IMG tags inside of P tags #1145

Closed impactvelocity closed 3 years ago

impactvelocity commented 3 years ago

What happens? Moved from quilljs to TipTap (react), and everything is great. However, quill adds a p tag around everything it seems. So an img tag is wrapped inside of a p tag. Inside TipTap it replaces the image with <br />. I think thats because TipTap adds images not wrapped in a P tag.

What behavior did you expect? It should show the image even if it is in a p tag, or remove the p tag?

My workaround, which I haven't coded yet, would be to parse the older html, find image tags and remove any P wrapper. But maybe tiptap has a solution for this already?

Do you have a screenshot? Video: https://share.getcloudapp.com/o0uEx60Z

:)

philippkuehn commented 3 years ago

Hey, unfortunately this seems to be impossible with ProseMirror right now :( https://discuss.prosemirror.net/t/how-to-deal-with-with-nodes-being-dropped-during-parsing/1962 https://discuss.prosemirror.net/t/hoist-elements-when-parsing-dom/2785

impactvelocity commented 3 years ago

Ah, okay, no worries! I am working on a little parse script that will fix it so TipTap is happy. :)

Thank you!!!

hanspagel commented 3 years ago

Thanks for reporting! Let me know if you run into other things, I’d love to document it for others!