JSFiddle - React, Tailwind, and code Playground

HTML

<p>Demonstration of Mozilla bugs <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=636171">636171</a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=810691">810691</a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=664720">664720</a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=687451">687451</a>. Click on the 'Run Test' button in Firefox and note that click and mouseup never fire. Also note that the :active style is applied to the button after the asynch event is fired, and is not removed until you click off of the button.</p>
<br/>
<input type="button" id="a_test" value="Run Test" />
<div id="message"></div>

JavaScript

var a_test = document.getElementById('a_test');
a_test.addEventListener("click", other_event);
a_test.addEventListener("mouseup", other_event);
a_test.addEventListener("mousedown", native_ajax);

function native_ajax(e) {
    log(e.type);

    function reqListener() {
        log(this.responseText);
    };

    var oReq = new XMLHttpRequest();
    oReq.onload = reqListener;
    oReq.open("post", '/echo/html/', false);
    oReq.send('html=ajax_success&delay=1');

}

function other_event(e) {
    log(e.type);
}

function log(msg) {
    $("#message").append(msg + '<br>');
}