Clock Javascript BDD example with Jasmine and Sinon.js

clock.js

var Clock = function( element )
{
	this.element = element;
	this._schedule();
}

Clock.prototype._schedule = function()
{
	var self = this;

	setTimeout( function() 
	{
		self._update();
		self._schedule();
	}, 1000 );
}

Clock.prototype._update = function()
{
	var self = this;

	this._request( '/time', function( response )
	{
		response = JSON.parse( response );
		self.element.innerHTML = response['time'] || 'Error';
	} );
}

Clock.prototype._request = function( url, callback )
{
	var request = new XMLHttpRequest();
	request.open( 'GET', url, true );

	request.onreadystatechange = function() 
	{
		if ( 4 == request.readyState ) 
		{
			callback( request.responseText ); 
		}
	}
	request.send();
}

test_clock.js

describe( "Clock", function()
{
	var timer;
	var server;
	var element;

	beforeEach( function()
	{
		timer 	= sinon.useFakeTimers();
		server 	= sinon.fakeServer.create();
		element = { innerHTML: '' };
	} );

	afterEach( function()
	{
		timer.restore();
		server.restore();
	} );

	it( "should update time every second", function()
	{
		server.respondWith(
			"GET", 
			"/time",
		    [
		    	200, 
		    	{ "Content-Type": "application/json" },
		        '{ "time": "2012-07-09 0:00:00" }'
		    ]
		);
		
		var clock = new Clock( element );

		timer.tick( 1100 );
		server.respond();		

		expect( element.innerHTML ).toBe( '2012-07-09 0:00:00' );
	} );

	it( "should show error when it can't update", function()
	{
		server.respondWith(
			"GET", 
			"/time",
		    [
		    	200, 
		    	{ "Content-Type": "application/json" },
		        '{"error": "sorry"}'
		    ]
		);
		
		var clock = new Clock( element );

		timer.tick( 1100 );
		server.respond();		

		expect( element.innerHTML ).toBe( 'Error' );
	} );

} );