Quick Start?

$ git clone https://github.com/akshayprasad/Karma-Jasmine.git

About Unit Testing:

Testing AngularJS Application :

AngularJS

Why Karma?

Why Jasmine?

Why ANGULAR MOCKS?

Project Setup:

a quick introduction to the Jasmine framework Jasmine

describe("suite name", function() {	it("contains spec with an expectation", function() {
expect(true).toBe(true);
});
});
describe("suite name", function() {  beforeEach(function () { /*excute before each spec*/ })  it("contains spec with an expectation", function() {
expect(true).toBe(true);
});
afterEach(function () { /*excute after each spec */ }) });
// spy on the method setBar of foo objectspyOn(foo, 'setBar');    it("contains spec with an expectation", function() {
expect(foo.setBar).toHaveBeenCalled();
expect(foo.setBar).toHaveBeenCalledWith(32);
});
});

Testing AngularJS

Test-Driven Development in practice

$ bower install angular
$ bower install angular-mocks

Controller

// get the module that contain the controller
beforeEach(module('appmodule'));
// inject the $controller and the rootScope
beforeEach(inject(function ($rootScope, $controller) {
// create a fresh new scope for the controller
scope = $rootScope.$new();
// create a controller with this scope
ctrl = $controller('appController',{$scope: scope});
}));

Services

// get the module that contain the service
beforeEach(module('appmodule'));
// inject the $injector
beforeEach(inject(function ($injector) {
// use the $injector to get a hold on the service
service = $injector.get(‘ServiceName’);
}));

Directive

// get the module that contain the service
beforeEach(module('appmodule'));
// inject the $compile service and the $rootScope
beforeEach(inject(function ($compile, $rootScope) {
// use the $rootScope to create a scope for the directive
scope = $rootScope;
// create an angular element from a HTML string
element = angular.element(‘<div my-directive ></div>’)
// compile the element with the scope
$compile(element)(scope)
scope.$apply()
}));

HTTP requests

// inject the $httpBackend service and the $rootScope
beforeEach(inject(function ($httpBackend) {
// use the $rootScope to create a scope for the directive
httpBackend = $httpBackend;
it("something that make a request", function() {
// expect a request
httpBackend.expectGET(‘api’).respond(200);
// code that make a request
httpBackend.flush(); // do`nt forget to flush..
});
}));

Productive Tips

// run this usite
ddescribe()
// run this spec
iit()
// skips this spec without executing.
xit()
// skips this block without executing.
xdescribe()

Sample Examples with explanation

Reference

I am Master's student in the Netherlands and has a previous work experience of 4 years in the field of Software Development.