JSFiddle - React, Tailwind, and code Playground

by gurkavcu

HTML

<ul id="results"/>

CSS

#results li.pass { color: green; }
#results li.fail { color: red; }

JavaScript

function assert(value, desc) {
    var li = document.createElement("li");
    li.className = value ? "pass" : "fail";
    li.appendChild(document.createTextNode(desc));
    document.getElementById("results").appendChild(li);
}

(function() {
    var queue = [],
        paused = false;
    this.test = function(fn) {
        queue.push(fn);
        runTest();
    };
    this.pause = function() {
        paused = true;
    };
    this.resume = function() {
        paused = false;
        setTimeout(runTest, 1);
    };

    function runTest() {
        if (!paused && queue.length) {
            queue.shift()();
            if (!paused) {
                resume();
            }
        }
    }
})();

/*
test(function() {
    pause();
    setTimeout(function() {
        assert(true, "First test completed");
        resume();
    }, 3000);
});
*/

/*function isNimble(){ return true; }
var canFly = function(){ return true; };
assert( isNimble() && canFly() && isDeadly(),
"All are functions, all return true" );
window.isDeadly = function(){ return true; };
*/

/*
function yell(n) {
    return n > 0 ? yell(n - 1) + "a" : "hiy";
}
assert(yell(4) == "hiyaaaa", "Calling the function by itself comes naturally.");

var ninja = {
    yell: function(n) {
        return n > 0 ? ninja.yell(n - 1) + "a" : "hiy";
    }
};
assert(ninja.yell(4) == "hiyaaaa", "A single object isn't too bad, either.");
*/

/*
var ninja = {
    yell: function yell(n) {
        return n > 0 ? yell(n - 1) + "a" : "hiy";
    }
};
assert(ninja.yell(4) == "hiyaaaa", "Works as we would expect it to!");
var samurai = {
    yell: ninja.yell
};
var ninja = {};
assert(samurai.yell(4) == "hiyaaaa", "The method correctly calls itself.");

var ninja = function myNinja() {
    assert(ninja == myNinja, "This function is named two things - at once!");
};
ninja();
assert(typeof myNinja == "undefined", "But myNinja isn't defined outside of the function.");
*/

/*
var ninja = {
    yell: function(n) {
        return n > 0 ?...