Don't wrap certain inline nodes in another marks


I’m trying to develop an image inline node with smart uploading. Everything seems to work just fine, however, I’ve stumbled upon 2 issues I can’t solve:

  1. I want to disallow the image marks to be wrapped in some other marks (bold, italic, underline, strike, etc.). As for now, given I have the following DOM:
<p>Some text some text <img ..> some text some text</p>

and I try select everything and applies BOLD to it, the entire paragraph’s content will be wrapped in a <strong> tag:

<p><strong>Some text some text <img ..> some text some text</strong></p>

Ideally, I would like it to be:

<p><strong>Some text some text </strong><img ..><strong> some text some text</strong></p>
  1. For some reason, Prosemirror adds a <br> to the end of my paragraph even tho it contains an image. Why is that?
<p><img ...><br></p> <!-- See the <br> at the end of the paragraph. Why? -->


Disallowing marks on some nodes isn’t supported (the parent node determines what marks are allowed, and that is used for all its children).

Works around bugs in the way browsers display the cursor. This isn’t part of the actual document, just rendered in the editable representation.

I see.

About the <br>, it seems to add unnecessary height to the document when the white-space is set to pre-wrap:

white-space: pre-wrap;

Is it needed?

That’s the default, and I don’t see any changes in height caused by the <br> (as I understand it, browsers will more or less not render anything for a <br> at the end of a block node).