Range coordinates

1

Is there a recommended way to get the left/top/width/height coordinates of a given range?

A naive approach would be to use coordsAtPos on the $from and $to positions and use their bounds. This falls down in a multi-line situation where the $from and/or $to are not at the left-most or right-most outside bounds of the content.

Using domRange.getBoundingClientRect() might work if I could translate a PM range to a DOM range, though I’m not sure how to do this.

2

Is this an area open for contribution?

3

Implemented here https://github.com/ProseMirror/prosemirror-view/pull/15. This unlocks the ability to add a floating menu near the selected text. Example:

1 Like
4

This was really useful. It was very clever of you to create a document.range to overcome the fact that Text nodes do not possess the getBoundingClientRect method. Thanks for your code.