Testing angular controllers with Jasmine
Testing angular controllers with Jasmine
by rajeshpillai
HTML
<script src="http://jasmine.github.io/1.3/lib/jasmine.js"></script>
<script src="http://jasmine.github.io/1.3/lib/jasmine-html.js"></script>
<link rel="stylesheet" href="http://jasmine.github.io/1.3/lib/jasmine.css">
<script src="http://code.angularjs.org/1.2.9/angular.js"></script>
<script src="http://code.angularjs.org/1.2.9/angular-mocks.js"></script>
JavaScript
//--- CODE --------------------------
(function (angular) {
// Create module
var myApp = angular.module('myApp', []);
// Controller which counts changes to its "name" member
myApp.controller('MyCtrl', ['$scope', function ($scope) {
$scope.name = 'Superhero';
$scope.counter = 0;
$scope.$watch('name', function (newValue, oldValue) {
$scope.counter = $scope.counter + 1;
});
}]);
// Controller with dependencies on Angular's $http service and promises
myApp.controller('CtrlHttp', function ($http, $scope, $q) {
// Returns a promise which is resolved if http calls succeeds,
// otherwise the promise is rejected
$scope.getHttp = function () {
var defer = $q.defer();
// Perform the actual HTTP call with query parameters
// e.g. GET <server url>/someUrl?key=value1
$http({
method: 'GET',
url: '/someUrl',
headers: {
'Accept-Language': 'en'
},
params: {
key1: "value1"
}
}).
success(function (data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
defer.resolve(data);
}).
error(function (data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
defer.reject();
});
return defer.promise;
};
});
})(angular);
// ---SPECS-------------------------
describe('myApp', function () {
var scope,
controller;
beforeEach(function () {
module('myApp');
});
describe('MyCtrl', function () {
beforeEach(inject(function ($rootScope, $controller) {
scope =...