Chrome-specific selectionToDOM kludge no longer necessary?

1

ProseMirror View has had this Chrome-specific drag-to-select kludge for 4 years or so: prosemirror-view/src/selection.ts at main - prosemirror/prosemirror-view - code.haverbeke.berlin

This is the originating issue: Can't select an atom node in Chrome if it's the last in a line · Issue #1152 · ProseMirror/prosemirror · GitHub

I can’t actually reproduce this issue in Chrome today. I made a non-ProseMirror contenteditable with this content:

<div contenteditable="true" translate="no" class="ProseMirror ProseMirror-example-setup-style ProseMirror-focused">
  <p>This is your dinosaur-enabled editor. The insert menu allows you to insert dinosaurs.</p>
  <p>
    This paragraph
    <img dino-type="stegosaurus" src="/img/dino/stegosaurus.png" title="stegosaurus" class="dinosaur" contenteditable="false" draggable="true">,
    for example,
    <img dino-type="triceratops" src="/img/dino/triceratops.png" title="triceratops" class="dinosaur" contenteditable="false" draggable="true">
    is full
    <img dino-type="tyrannosaurus" src="/img/dino/tyrannosaurus.png" title="tyrannosaurus" class="dinosaur" contenteditable="false" draggable="true">
    <img class="ProseMirror-separator" alt="">
    <br class="ProseMirror-trailingBreak">
  </p>
  <p>Dinosaur nodes can be selected, copied, pasted, dragged, and so on.</p>
</div>

And I can make a selection that ends after the final dinosaur image without issue.

I think this is actually great, because I’m pretty sure that this kludge is also causing a selection bug on Chrome. If you drag-to-select rapidly on Chrome (at least on macOS, I’m having trouble reproducing on Linux), you can pretty easily get this to occur: the very last selectionchange event produced by the drag doesn’t “stick” — you see the selection range expand, and then when you release the mouse, it snaps back to the previous selection range. The more complex the editor (it seems like both more complex/slow node views/plugins and dispatching a large volume of transactions, or transactions at inopportune times), the easier it seems to be to reproduce this, but we were able to reproduce this on the prosemirror.net front page demo after pasting some content into it.

I’m happy to open an issue or PR for this if that would be helpful, but:

  • I wanted to double check that there wasn’t some other case that this was guarding against
  • I don’t know how you usually think about older browser support, and I don’t actually know which version of Chrome fixed the selection issue that this was working around
2

I have a video of the reproduction on prosemirror.net, but I think I can’t upload videos here. I can find somewhere convenient to host it, if that would be helpful!

3

Dropping this hack brings back the selection flickering issue when you, for example, try to select to the end of a paragraph that ends in a (side > 0) widget—every pixel the mouse moves will cause Chrome to reset the selection to end after the widget, after which ProseMirror will immediately move it back before the widget.

I cannot reproduce the issue you describe (in Chrome 150 on MacOS). It’s of course not really observable at which point the mouse hardware decided to no longer count the button as pressed, so it’s hard to really pin this down, but doing a lot of rapid-moving selections, I didn’t get the impression that the selection didn’t end where I released the mouse button.

Which isn’t to say that I doubt the issue exists. But, even after pasting in several megabytes of text, I couldn’t get it to happen.

I cannot really envision a scenario where the hack you refer to would be the cause of the issue. It does not interfere with the way the browser updates the DOM selection, nor with the way that DOM selection is converted to a ProseMirror selection and stored in the state. It only avoids resetting the DOM selection during the drag gesture, so the native selection should be less affected by the editor script.

A video would probably not help a lot. I can work better with textual descriptions of things than videos.