Selection issue in Firefox with certain DOM elements in node view

I’ve run into a selection issue in Firefox that I’ve narrowed down to dragging a selection over certain types of element in a node view. Here’s a minimal demonstration.

Try dragging a selection from the first paragraph onto a list item, and you’ll see that the anchor is lost when the selection reaches the list (if you monitor the selection with prosemirror-dev-tools it’s actually lost when dragging the selection between paragraphs as well, but not visibly).

This happens when a certain type of element (at least a button or an SVG element, but not an a) is inserted into the node view.

It doesn’t seem to matter whether or not the extra content in the node view is marked as contenteditable="false".

This issue isn’t seen in Chrome, so there’s something about Firefox’s selection that’s causing this, but it’s hard to define exactly what it might be…

This does seem to be ProseMirror-related, as the issue isn’t seen with the same HTML outside ProseMirror.

Yeah, I have the same issue. Maybe @marijn can say something about this?

I had the same issue. Basically when a selection comes across a svg node in HTML Firefox creates a multi range selection (While Chrome only keeps one range). I fixed it on my fork https://github.com/paulfab/prosemirror-view/commit/d57834eb454292b641419154887093a76ed2adea

Don’t know if @marijn is interested in merging it

1 Like