yxkelan/gist:5095821

## gistfile1.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
  <style>
    li.pass{
      color:green;
    }
    li.fail{
      color:red;
    }
  </style>
  <script>
    function assert(value,desc){
      var li = document.createElement("li");
      li.className = value?"pass":"fail";
      li.appendChild(document.createTextNode(desc));
      document.getElementById("results").appendChild(li);
    }
    window.onload = function(){
      assert(true,"The test suite is running.");
      assert(false, "Fail");
    };
  </script>

</head>
<body>
  <ul id="results"></ul>
</body>
</html>

## gistfile2.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
  <style>
    li.pass{
      color:green;
    }
    li.fail{
      color:red;
    }
  </style>
  <script>

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

    this.test = function test(name,fn){
        results = document.getElementById("results");
        results = assert(true,name).appendChild(document.createElement("ul"));
        fn();
    };
})();

    window.onload = function(){
      test("A test.", function(){
        assert(true,"First Assertion Completed.");
        assert(true,"Second Assertion Completed.");
        assert(true,"Third Assertion Completed.");

      });

      test("A second test.", function(){
        assert(true,"First Test Commpleted.");
        assert(false, "Second Test Failed");
      });
    };
  </script>

</head>
<body>
  <ul id="results"></ul>
</body>
</html>

## gistfile3.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
  <style>
    li.pass{
      color:green;
    }
    li.fail{
      color:red;
    }
  </style>
  <script>
    (function(){
      var queue=[],paused=false, results;
      this.assert = function assert(value,desc){
        var li = document.createElement("li");
        li.className = value?"pass":"fail";
        li.appendChild(document.createTextNode(desc));
        results.appendChild(li);
        if(!value){  li.parentNode.parentNode.className = "fail";}
        return li;
      };

      this.test = function test(name,fn){
        queue.push(function(){
          results = document.getElementById("results");
          results = assert(true,name).appendChild(document.createElement("ul"));
          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();
          }
        }
      }

})();

    window.onload = function(){
      test("Async Test #1", function(){
        pause();
        setTimeout(function(){
          assert(true,"First Assertion Completed.");
          resume();
        },1000);
      });

   test("Async Test #2", function(){
        pause();
        setTimeout(function(){
          assert(false,"Second Assertion Completed.");
          resume();
        },1000);
      });

    };
  </script>

</head>
<body>
  <ul id="results"></ul>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset=utf-8 />
	<title>JS Bin</title>
	<style>
	li.pass{
	color:green;
	}
	li.fail{
	color:red;
	}
	</style>
	<script>
	function assert(value,desc){
	var li = document.createElement("li");
	li.className = value?"pass":"fail";
	li.appendChild(document.createTextNode(desc));
	document.getElementById("results").appendChild(li);
	}
	window.onload = function(){
	assert(true,"The test suite is running.");
	assert(false, "Fail");
	};
	</script>

	</head>
	<body>
	<ul id="results"></ul>
	</body>
	</html>