JSFiddle - React, Tailwind, and code Playground

HTML

<div id="editor" contenteditable="true"></div>

CSS

#editor {
  width: 500px;
  height: 200px;
}

JavaScript

var editor = document.querySelector('#editor');

editor.addEventListener( 'keydown', function( evt ) {
	console.log( 'keydown', evt.which, evt );
} );

editor.addEventListener( 'keyup', function( evt ) {
	console.log( 'keyup', evt.which, evt );
} );

editor.addEventListener( 'keypress', function( evt ) {
	console.log( 'keypress', evt.which, evt );
} );

editor.addEventListener( 'input', function( evt ) {
	console.log( 'input', evt );
} );

editor.addEventListener( 'compositionstart', function( evt ) {
	console.log( 'compositionstart', evt );
} );

editor.addEventListener( 'compositionupdate', function( evt ) {
	console.log( 'compositionupdate', evt );
} );

editor.addEventListener( 'compositionend', function( evt ) {
	console.log( 'compositionend', evt );
} );

editor.addEventListener( 'textinput', function( evt ) {
	console.log( 'textinput', evt );
} );