Search code examples
mouseeventcodemirror

Codemirror mouseup event

By contrast to mousedown, it seems that the mouseup event is not fired by a CodeMirror instance (its documentation does not include a mouseup event).

I need to react to a mouseup event to move the focus to another Codemirror instance.

The situation is the following: one editor (say, editor1) is "read-only", but selection (and copy to clipboard) must be allowed. If only a click on editor1 is performed, the focus must be moved to the other instance (say, editor2). If a selection is made on editor1, the focus must not be moved to editor2.

I can react on mousedown (as in the next example), but not on mouseup:

<script>

var editor1 = CodeMirror(document.body, {
  readOnly : true,
  cursorBlinkRate : -1
});

var editor2 = CodeMirror(document.body);

editor1.on("mousedown", function (cm, ev) {
  ev.codemirrorIgnore = true;
  ev.preventDefault();
  editor2.focus();
});

</script>
Solution

  • You shouldn't use codemirros mouse events for that use case. Instead I would recommend to use vanilla mouse events and then check if the selection is empty and if so move the focus

    DEMO: https://codepen.io/quic5/pen/EGEREr