I hope my decoration can wrap around my mark during rendering. For example, I want <span class="my-decoration"><code>text</code><span>, not <code><span class="my-decoration">text</span></code>.
After reading other discussions, I realized that this seems impossible, as inline decorations are drawn inside the wrapper elements added for marks. However, I still want to explain my scenario to see if there are other ways to achieve this.
When I edit a link, the focus moves to my input box. To make the selection clearly visible to the user, I used a decoration to create a fake selection.
However, due to the DOM structure generated by the decoration, it’s hard for me to adjust the style of this fake selection. As you can see, in my example, my selection differs somewhat from the real selection.
We want to highlight mentions of names in the text, but have the marks be of a lesser priority.
The editor now splits the words on mark boundaries, which is not what we want (the yellow marker is me hovering over the text, it should cover the full word instead):
the yellow marker is me hovering over the text, it should cover the full word instead
I don’t really see how HTML nesting order could make the highlighting disappear for part of the word. What does your decoration look like in this case, and what DOM structure does the editor generate?