Knockout JS + Testes com Jasmine

modal.js

MeusProtocolos.ComponentesUI.Modal = function () {
	var self = this;

	function ModalViewModel() {
		var self = this;

		self.titulo = ko.observable('');
		self.mensagem = ko.observable('');
		self.visivel = ko.observable(false);
		self.opcoes = {};

		self.exibirBotaoFechar = ko.computed(function () {
			return self.opcoes.exibirBotaoFechar;
		});

		self.exibirBotaoOK = ko.computed(function () {
			return self.opcoes.exibirBotaoOK;
		});

		self.OK = self.opcoes.OK;
		self.fechar = self.opcoes.fechar;
	};

	self.vm = new ModalViewModel();
	self.opcoesPadrao = {
		exibirBotaoOk: true,
		exibirBotaoFechar: true,
		OK: function () { self.fecharModal(); },
		fechar: function () { }
	};

	self.inicializar = function () {
		var modal = $('#modal');

		modal.on('hide', function () { self.vm.visivel(false) });

		self.vm.visivel.subscribe(function (value) {
			modal.modal('toggle');
		});

		ko.applyBindings(self.vm, modal[0]);
	};

	self.abrirModal = function (titulo, mensagem, o) {
		self.vm.opcoes = MeusProtocolos.Util.extend(true, self.opcoesPadrao, o);

		self.vm.titulo(titulo);
		self.vm.mensagem(mensagem);
		self.vm.visivel(true);
	};

	self.fecharModal = function() {
		self.vm.visivel(false);
	};
}

ModalSpecs.js

describe("Modal", function () {
	beforeEach(function () {
		this.addMatchers({
			toExist: function () {
				return this.actual != null;
			},
			toBeHidden: function () {
				return this.actual.vm.visivel() === false;
			},
			toBeDisplayed: function () {
				return this.actual.vm.visivel() === true;
			},
			toHaveTitle: function (title) {
				return this.actual.vm.titulo() === title;
			},
			toHaveMessage: function (message) {
				return this.actual.vm.mensagem() === message;
			},
			toShowOKButton: function () {
				return this.actual.vm.opcoes.exibirBotaoOk === true;
			},
			toShowCloseButton: function () {
				return this.actual.vm.opcoes.exibirBotaoFechar === true;
			}
		});

		modal = new MeusProtocolos.ComponentesUI.Modal();
		modal.inicializar();
	});

	it("deve existir", function () {
		expect(modal).toExist();		
	});

	describe('quando inicializado', function () {
		it("deve estar escondido", function () {
			expect(modal).toBeHidden();
		});
	});

	describe('quando aberto com configuracoes padroes', function () {
		beforeEach(function () {
			modal.abrirModal('', '');
		});

		it('deve estar visivel', function () {
			expect(modal).toBeDisplayed();
		});

		it('deve exibir o botao OK', function () {
			expect(modal).toShowOKButton();
		});

		it('deve exibir o botao fechar', function () {
			expect(modal).toShowCloseButton();
		});
	});

	describe('quando aberto com titulo e conteudo', function () {
		beforeEach(function () {
			modal.abrirModal('titulo', 'mensagem');
		});

		it('deve exibir o titulo informado', function () {
			expect(modal).toHaveTitle('titulo');
		});

		it('deve exibir a mensagem informada', function () {
			expect(modal).toHaveMessage('mensagem');
		});
	});
});