title: when keyDown 'A', I want 'C' is diplayed, React
body: <h2>condition</h2>
  <p>when I press 'D', I want 'X' to be displayed in inputField, not 'D'.</p>
  <p>when I press 'ArrowDown', I want 'ArrowRight' to be triggered. not 'ArrowDown'.</p>
  <p>using Typesript, Next</p>
  <h3>what I tried:</h3>
  <pre class="lang-js prettyprint-override"><code>const drunkenKeyboard = (e) =&gt;{
    if(e.code === 'ArrowDown') {
      const action = new KeyboardEvent('keydown', {key: 'ArrowLeft'});
      inputRef.current.dispatchEvent(action);
    }
  }
  
  // ...
  
  &lt;input onKeyDown={drunkenKeyboard} ref={inputRef}  ... /&gt;
  </code></pre>
  <p>but this cause type error :(</p>
  <pre class="lang-js prettyprint-override"><code>Unhandled Runtime Error
  TypeError: react_WEBPACK_IMPORTED_MODULE_1__.KeyboardEvent is not a constructor
  </code></pre>
  <p>what should I do? any ideas?
  thanks.</p>