Can selection be made visible after prosemirror is blurred?

1

I was wondering if it was possible to make text selection visible even when Prosemirror editor is not focused?

If not, what would be a simple way to change A to B text selection range to just cursor being on location A after editor is blurred?

Reproduction steps:

2

Hmmm not sure about keeping the actual range, but you could probably write a listener so that on blur you create a decorator to add a class around the range that is selected. The class can then mock the default highlight behavior with a background-color.

3

Yes, what @wes-r said, but note that a decorated range won’t look exactly like a real selection (won’t extend to the left margin, for example, and often leaves gaps).

Having your own onBlur prop set the selection to a plain cursor is also really easy.

4

Thanks, I also think it’s probably better to just turn selection into a cursor, like so:

onBlur: function(view) {
  let selection = new TextSelection(view.state.selection.$from);
  view.props.onAction(selection.action())
},
5

That’d create invalid selections when the selection used to be a non-inline node selection (cursor selections can only occur inside textblocks). You might also want to leave node selections alone entirely. Something like:

onBlur: function(view) {
  let {$head, empty} = view.state.selection
  if ($head && !empty) view.props.onAction(new TextSelection($head).action())
},
1 Like
6

How would one do this on 2021? The action methods don’t exist anymore :confused: Presumably they’re related to transactions now?