JS: Jest

more at: https://github.com/benbscholz/jest

by dingen2010

HTML

<div id="jest-tests"></div>

CSS

/* Jest styles */

/* base style */
 #jest {
    width: 700px;
    margin: auto;
    border: 1px solid #555;
    background-color: rgba(225, 225, 225, 1);
    font-family: Helvetica, Arial, sans-serif;
}
#jest li {
    list-style-position: inside;
}
/* header style */
 #jest-stats, #jest-header, #user-info {
    display: inline-block;
    vertical-align: top;
}
#jest .banner {
    width: 124px;
    height: 50px;
    color: #fff;
    text-decoration: none;
    text-align: center;
    text-shadow: 0 -1px rgba(0, 0, 0, .25);
    line-height: .7em;
    border: 1px solid #888;
    border-top: none;
    background-color: #999;
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0, 0, 0, .0)), to(rgba(0, 0, 0, .25)));
    box-shadow: inset 0 0 2px rgba(255, 255, 255, .5), inset 0 -5px 20px rgba(0, 0, 0, .15), 0 2px 5px rgba(0, 0, 0, .25);
}
#jest-stats, #user-info {
    font-size: 12px;
}
#jest-stats {
    margin: 0 0 0 70px;
}
#user-info {
    margin: 0 69px 0 0;
}
#jest-header {
    width: 300px;
}
#jest-header h1 {
    margin: 0;
    font-size: 60px;
    font-weight: 400;
    font-family: Georgia, serif;
    text-align: center;
    line-height: .9em;
    letter-spacing: .2em;
}
#jest-header hr {
    margin: auto;
    width: 250px;
}
#jest-header h2 {
    margin: 2px 0 0 0;
    font-size: 18px;
    font-weight: 100;
    text-align: center;
    text-shadow: 0 -1px #fff;
    letter-spacing: .1em;
}
/* test styles */
 #jest-tests .passed, #jest-tests .failed, #jest-tests .message {
    display: inline-block;
}
#jest-tests .message {
    margin: 0;
    padding: 0;
}
#jest-tests .passed {
    background-color: rgba(100, 255, 100, 1);
}
#jest-tests .passed.test {
    border: 1px solid #395;
    background-color: #6c8;
}
#jest-tests .failed {
    background-color: #c66;
}
#jest-tests .failed.test {
    border: 1px solid #933;
    background-color: #c66;
}
/* error styles */
 #jest-error {
    width: 100%;
    margin: -1px auto 0 auto;
    border-radius:...

JavaScript

// jest is a unit testing framework.
// 2011 (c) Ben Brooks Scholz. MIT Licensed.

(function (window) {

    "use strict";

    var Module = function (name) {
        this.name = name;
        this.tests = [];
    };

    Module.prototype = {
        setup: function () {
            var jestTests = id('jest-tests'),
                module = id(this.name.split(' ').join('-')),
                moduleHeader;

            if (!module && jestTests) {
                module = create('ol');
                module.id = this.name.split(' ').join('-');
                moduleHeader = create('h2');
                moduleHeader.innerHTML = this.name;
                module.appendChild(moduleHeader);
                jestTests.appendChild(module);
            }
        },

        run: function () {
            var test;

            while (this.tests.length) {
                test = this.tests.shift();
                this.currentTest = test;
                test.setup.call(test);
                test.run.call(test);
                test.finish.call(test);
            }
        },

        finish: function () {
            return;
        }
    };

    var Test = function (module, name, expected, callback) {
        this.module = module;
        this.name = name;
        this.expected = expected;
        this.actual = 0;
        this.failed = 0;
        this.time;
        this.callback = callback;
        this.results = [];
    };

    Test.prototype = {
        setup: function () {
            var jestTests = id('jest-tests'),
                module = id(this.module.split(' ').join('-')),
                testList = create('ol'),
                testsHeader = create('h3');

            if (jestTests) {
                testList.id = this.name.split(' ').join('-');
                testsHeader.id = this.name.split(' ').join('-') + '-header';

                testList.appendChild(testsHeader);
                module.appendChild(testList);
               ...