Paste paragraph containing br

#1

Hello, Prosemirror community.

I’m working on Copy / Paste feature, and here’s the problem now I ran into. If I try to paste html like this,

<p>
  text
  <br>
  text
</p>

It’s rendered like this in Prosemirror,

<p>
  textext
</p>

and this is what I want it to be

<p>
  text
</p>
<p>
  text
</p>

In other words, I want to split paragraph from where break(br) tag be when copy paste html.

I used preserveWhitespace option, hard_break schema, but non of them work. Any Idea to solve this problem? Thanks.

#2

Making a <br> node start a new paragraph isn’t something that the DOMParser can currently do—you can of course make it insert any node in its place, for example a hard_break node, as I guess you found out, but there’s no way for a parse rule to force the current parent node to be closed.

That might be a good thing to add to the library, but I’m not sure when I’ll have time to work on that.

2 Likes
#3

Thanks for your quick reply. So there’s no option for parseRule to split or close parent Node…

At the end I added simple logic in transformPastedHTML (DirectEditorProps).

transformPastedHTML: (html: string) => {
  return html.replace(/<br[^>]*>/g, '</p><p>')
}

This is not a complete solution but can bypass the problem in some case. It would be great parseRule can accept option.

/* Suggestion */

{
  tag: 'p',
  breakPoint: [
    { tag: 'br' },
  ],
  ... // other options
}
#4

Could you see if this patch works for you?