Triple click behavior

v6
1

I’m dealing with a case where triple clicking a line will select everything on the line + the newline character at the very end.

It seems that this deviation from standard text selection behavior is generally intended for code editors because it helps with workflows involving copy-pasting blocks of code.

Would it make sense to allow this behavior to be customized? If not, I can just put the custom behavior in a fork instead.

2

An extension like this implements triple-click behavior without adding the line break after:

  EditorView.mouseSelectionStyle.of((view, event) => {
    if (event.detail != 3 || event.button != 0) return null
    let start = view.posAtCoords(event)
    if (start == null) return null
    let startSel = view.state.selection
    return {
      get(curEvent, extend, multiple) {
        let head = view.posAtCoords(curEvent)
        if (head == null) return startSel
        let anchor = extend ? startSel.main.anchor : start!
        let anchorLine = view.state.doc.lineAt(anchor), headLine = view.state.doc.lineAt(head)
        let range = head >= anchor ? EditorSelection.range(anchorLine.from, headLine.to)
          : EditorSelection.range(anchorLine.to, headLine.from)
        return multiple ? startSel.addRange(range) : EditorSelection.create([range])
      },
      update(update) {
        start = update.changes.mapPos(start!)
        startSel = startSel.map(update.changes)
      }
    }
  })
3 Likes
3

Thanks, that works perfectly! I totally forgot we can override with that API.

4

Note that this is only true in Firefox (maybe other browsers on Linux/Mac, can’t check since I’m on Windows). The standard behavior on Windows in all environments I know (IDEs, Chrome) is to include the trailing newline in the selection. So, CodeMirror may try to match the browser/OS behavior.