Determining local user selection vs programatic

I’m using allowMultipleSelections to display cursors from remote clients. Each client needs to send its own selection. I saw EditorSelection.main but that seems to be the last applied selection, not the one created by the user interaction.

My current solution is to read the main selection in a transaction with a keyboardselection or pointerselection userEvent annotation. It seems like selection.main should be the user’s local selection.

Is this the correct way to go about it?

Here’s the logic I have:

const updateListener = EditorView.updateListener.of(
  (update) => {
     const updatedLocalSelection = update.transactions.reduce(
       (selection: SelectionRange | null, t) => {
         const event = t.annotation(Transaction.userEvent)
         
         if (
           (event === 'keyboardselection' || event === 'pointerselection') 
           && t.selection
         ) {
           return t.selection.main
         }
         
        return selection
      }, null)

     if (updatedLocalSelection) {
        // send updatedLocalSelection
     }
})

I’m going to have to stop you right there. Don’t do this. The editor selection is the local user’s selection, putting remote cursors in there just doesn’t make any sense. The whole codebase assumes that user actions apply to all selection ranges.

You could use decorations or your own overlay to display remote cursors.

Good to know, thanks!

I actually started with a mark decoration but tried using selections because the spacing between lines leads to gaps when using marks.

Screen Shot 2021-03-23 at 7.34.21 AM

Probably fixable with some css or a custom view plugin. Thanks for clarifying.

Turns out I just needed to create the decoration mark with tagName: 'div'.