JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.17/fabric.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="t">Test</button>

<canvas id="cvs" width="150" height="150"></canvas>

CSS

body {
  -webkit-touch-callout: none;
  /* prevent callout to copy image, etc when tap to hold */
  -webkit-text-size-adjust: none;
  /* prevent webkit from resizing text to fit */
  -webkit-user-select: none;
}

JavaScript

(function($) {
  $.fn.longpress = function(longCallback, shortCallback, duration) {
    if (typeof duration === "undefined") {
      duration = 500;
    }

    return this.each(function() {
      var $this = $(this);

      // to keep track of how long something was pressed
      var mouse_down_time;
      var timeout;

      // mousedown or touchstart callback
      function mousedown_callback(e) {
        mouse_down_time = new Date().getTime();
        var context = $(this);

        // set a timeout to call the longpress callback when time elapses
        timeout = setTimeout(function() {
          if (typeof longCallback === "function") {
            longCallback.call(context, e);
          } else {
            $.error('Callback required for long press. You provided: ' + typeof longCallback);
          }
        }, duration);
      }

      // mouseup or touchend callback
      function mouseup_callback(e) {
				var context = $(this);
        var press_time = new Date().getTime() - mouse_down_time;
        if (press_time < duration) {
          // cancel the timeout
          clearTimeout(timeout);

          // call the shortCallback if provided
          if (typeof shortCallback === "function") {
            shortCallback.call($(this), e);
          } else if (typeof shortCallback === "undefined") {;
          } else {
            $.error('Optional callback for short press should be a function.');
          }
        } else {
          if (typeof longCallback === "function") {
            longCallback.call(context, e);
          } else {
            $.error('Callback required for long press. You provided: ' + typeof longCallback);
          }
        }
      }

      // cancel long press event if the finger or mouse was moved
      function move_callback(e) {
        clearTimeout(timeout);
      }

      // Browser Support
      $this.on('mousedown', mousedown_callback);
      $this.on('mouseup', mouseup_callback);
      $this.on('mousemove',...