Best way to re-add text selection

[PraiseMirror]

The current selection can be a bit buggy when you click on Toolbar/menu item buttons depending on where they are placed. In particular the selection can disappear or become different. This post tries to solve it with a plugin:

Keeping selection while using the menu or clicking outside the document

While making my menu, I’ve noticed that the selected text will disappear as soon as click anywhere outside the document (which my menu is). So if I have a dropdown of headers for example, clicking on the dropdown will unselect my text (though the prosemirror selection will stay). This makes it unclear what will happen when I style the text, i.e. which text is currently selected. This is browser behavior and consistent across all web editors, most of them have a hack that highlights the selectio…

I implemented the plugin and on the whole it works, however, there are a number of issues with it. Firstly, it overwrites the css background, which is different on each browser & OS. But depending on your schema, for me it creates a new span around the selection, which causes problems for my custom menu item commands.

Also, re-adding the selection is somewhat hacky. What’s the best way to do this? Can we use setSelection from transaction, and handle the selection before dispatching the transaction rather than after the event (as in the above plugin)? And ideally use PM native functions, rather than setting the css ourselves. Is there a simple way like setting selection.visible = true after the transaction?

Thanks very much

[marijn]

(Don’t use transaction.curSelection. That’s not public. transaction.selection and possibly transaction.selectionChanged are what you want.)

Also, re-adding the selection is somewhat hacky. What’s the best way to do this?

What does re-adding the selection mean? Just focusing the editor with .focus() should restore the DOM selection to whatever state.selection holds.