JSFiddle - React, Tailwind, and code Playground

by nathan

JavaScript

window.addEventListener('keypress', function (event) {
    var body = document.getElementsByTagName('body')[0];
    body.innerHTML += '<br>' + event.charCode;
    event.preventDefault();
});

(function () {
    var args = arguments,
        keydownInitialDelay,
        keydownSubsequentDelay,
        delayTime = 500,
        repeatTime = 250,
        fireEvent;
    fireEvent = function (target, keycode, ctrl, alt, shift, meta) {
        var createdEvent = document.createEvent('KeyboardEvent');
        
        createdEvent.initKeyboardEvent('keypress', true, true, window, ctrl, alt, shift, meta, 12, 12);
        target.dispatchEvent('keypress', createdEvent);
    };
    window.addEventListener('keydown', function (event) {
        if (Array.prototype.indexOf.call(args, event.which) !== -1) {
            keydownInitialDelay = window.setTimeout(function () {
                keydownSubsequentDelay = window.setInterval(function () {
                    fireEvent(event.target, event.which, event.ctrlKey,
                        event.altKey, event.shiftKey, event.metaKey);
                }, repeatTime);
            }, delayTime - repeatTime);
            fireEvent(event.target, event.which + 200, event.ctrlKey, event.altKey, event.shiftKey, event.metaKey);
        }
    });
    window.addEventListener('keyup', function (event) {
        window.clearTimeout(keydownInitialDelay);
        window.clearInterval(keydownSubsequentDelay);
    });
// Pass the keycodes for arrow (cursor) keys as arguments
}(37, 38, 39, 40));