JSFiddle - React, Tailwind, and code Playground

by Jools Chadwick

HTML

<textarea id="TheOneElement"></textarea>
<textarea id="TheSecondElement"></textarea>

JavaScript

let $body = $(document.body);

let $elem = $('#TheOneElement');

let seenKeydownBody = false
let seenKeydownElem = false


function keydown(event) {
  let tag = event.currentTarget.tagName;
  if (event.keyCode === 86 && event.ctrlKey === true) {
    console.log(tag+': ctrl+v keydown');
    if (seenKeydownBody && tag == "BODY") {
      debugger;
    }
    if (seenKeydownElem && tag != "BODY") {
      debugger;
    }

    if (tag == "BODY") {
      seenKeydownBody = true;

    } else {
      seenKeydownElem = true;
    }
  }
}

function paste(event, caller) {
  let tag = event.currentTarget.tagName;

  console.log(tag+': paste');

  if (!seenKeydownBody && tag == "BODY") {
    debugger;
  }
  if (!seenKeydownElem && tag != "BODY") {
    debugger;
  }
  tag == "BODY" ? seenKeydownBody = false : seenKeydownElem = false;
}

$elem.on('keydown', keydown);

$elem.on('paste', paste);

$body.on('keydown', keydown);

$body.on('paste', paste);