JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<p id="text">
high light me (via double click or normal mouse selection...)
</p>

<input type="text" id="chatInput">

JavaScript

var mouseDownStart = 0,
    lastKeyupTime = 0;

function processKeyDown() {
  if (!mouseDownStart) {
    mouseDownStart = Date.now();
  }
}

function processKeyUp() {
  var now = Date.now(),
      isDoubleClick = lastKeyupTime && now - lastKeyupTime < 500;
      isHighliting = now - mouseDownStart > 150

  lastKeyupTime = now;
  mouseDownStart = 0;

  return {
    isDoubleClick: isDoubleClick,
    isHighliting: isHighliting
  }
}

$('#text').on('mousedown', function (e) {
  processKeyDown();
});


 $('#text').on('mouseup', function (e) {
  var data = processKeyUp();
  if (data.isDoubleClick || data.isHighliting) return;
  $('#chatInput').focus();
});