JSFiddle - React, Tailwind, and code Playground

HTML

<input type="file" id="upload"/>
<textarea id="output"></textarea>

CSS

textarea {
    display:block;
    width:100%;
    height:500px;
}

JavaScript

var upl = document.getElementById('upload');
upl.addEventListener('change', eventHandler);

addEventListener('dragover', function(e){e.preventDefault();});
addEventListener('drop', function(e) {
    eventHandler.call((e.dataTransfer||e.clipboardData));
    e.preventDefault();
});

function eventHandler() {
    var file = this.files[0];
    var reader = new FileReader();
    reader.onloadend = callbackFn;
    reader.readAsText(file);
    if (this.id) { //only run if this is the input
        var id = this.id;
        this.outerHTML = this.outerHTML; //this resets the input
        document.getElementById(id).addEventListener('change', eventHandler);
    }
}
function callbackFn(e) {
    document.getElementById('output').value = e.target.result;
}