JSFiddle - React, Tailwind, and code Playground

by duarteleao

HTML

<div tabindex="0" id="onKeydown">
      Tab here and then try out SHIFT+F10, Right-Click and Menu key.
      <br>
      Open web console to see events being fired.
    </div>

JavaScript

const keydownDiv = document.getElementById("onKeydown");

let counter = 0;

function log(text) {
  console.log( `[${++counter}] ${text}`);
}

keydownDiv.addEventListener("contextmenu", (e) => {
  log( "Context menu event");
});

keydownDiv.addEventListener("keydown", (e) => {
  log(`Keydown event: ${e.shiftKey ? "SHIFT + " : ""} ${e.key}`);
  if(e.shiftKey && e.key === 'F10') {
  	e.preventDefault();
  }
});