JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="input" rows=5 style="width:99%"></textarea>
<textarea id="output" rows=25 style="width:99%"></textarea>

JavaScript

var inp = document.getElementById('input');
var outp = document.getElementById('output');

function log(str){
    outp.value = str + '\n' + outp.value;
}

var events = 'keydown keyup keypress input textInput text DOMCharacterDataModified compositionstart compositionupdate compositionend'.split(' ');

function listener(e){
    var str = (e.type + '               ').slice(0,17);
    if (e.keyCode) str += '\tkeyCode:' + e.keyCode;
    if (e.data) str += '\tdata:' + e.data;
    str += '\tvalue:' + inp.value; 
    log(str);
}

events.forEach(function(name){
    inp.addEventListener(name, listener, false);
});