I have the following controller and service that I am trying to write tests around in Jasmine. I am fairly new to this, and just wanted to see if I am taking the correct approach in testing and mocking my services.
Controller
(function () {
'use strict';
var app = angular.module('cs');
app.controller('PlateCheckCtrl', ['$scope', 'PlateCheckService', function ($scope, PlateCheckService) {
var plateCheck = {
plateNumber: '',
message: '',
alertClass: '',
checkPlate: function (plateNumber) {
var _this = this;
PlateCheckService.checkPlate(plateNumber).then(function (response) {
_this.message = response.message;
_this.alertClass = response.alertClass;
});
}
};
$scope.plateCheck = plateCheck;
}]);
}());
Service
(function () {
'use strict';
var app = angular.module('cs');
app.service('PlateCheckService', ['$http', function ($http) {
return {
checkPlate: function (plateNumber) {
return $http.post('PlateCheck/Index', {
plateNumber: plateNumber
}).then(function (response) {
return {
message: response.data.VehicleAtl === null ? 'Clean' : 'Hot',
alertClass: response.data.VehicleAtl === null ? 'alert-success' : 'alert-danger'
};
});
}
};
}]);
}());
Controller Test
describe('Spec Template', function () {
var scope,
controller;
beforeEach(function () {
module('cs');
inject(function ($rootScope, $controller, $q) {
scope = $rootScope.$new();
controller = $controller('PlateCheckCtrl', {
$scope: scope, PlateCheckService: {
checkPlate: function (plateNumber) {
var d = $q.defer();
if (plateNumber === '123') {
d.resolve({
message: 'Clean',
alertClass: 'alert-success'
})
} else {
d.resolve({
message: 'Hot',
alertClass: 'alert-danger'
})
}
return d.promise;
}
}
});
});
});
it('Should return "Clean" result', function () {
scope.plateCheck.checkPlate('123');
scope.$apply();
expect(scope.plateCheck.message).toBe('Clean');
expect(scope.plateCheck.alertClass).toBe('alert-success');
});
it('Should return "Hot" result', function () {
scope.plateCheck.checkPlate('123456');
scope.$apply();
expect(scope.plateCheck.message).toBe('Hot');
expect(scope.plateCheck.alertClass).toBe('alert-danger');
});
});
Service Tests
describe('Plate Check Service', function () {
var httpBackend,
service;
beforeEach(function () {
module('cs');
inject(function ($httpBackend, PlateCheckService) {
httpBackend = $httpBackend;
httpBackend.whenPOST('PlateCheck/Index', { plateNumber: '123' }).respond({ VehicleAtl: null });
httpBackend.whenPOST('PlateCheck/Index', { plateNumber: '123456' }).respond({ VehicleAtl: {} });
service = PlateCheckService;
});
});
afterEach(function () {
httpBackend.verifyNoOutstandingExpectation();
httpBackend.verifyNoOutstandingRequest();
});
it('Should send the request to the server', function () {
httpBackend.expectPOST('PlateCheck/Index', { plateNumber: '123' });
service.checkPlate('123');
httpBackend.flush();
});
it('Should return a "Clean" result', function () {
var result;
service.checkPlate('123').then(function (response) {
result = response;
});
httpBackend.flush();
expect(result.message).toBe('Clean');
expect(result.alertClass).toBe('alert-success');
});
it('Should return a "Hot" result', function () {
var result;
service.checkPlate('123456').then(function (response) {
result = response;
});
httpBackend.flush();
expect(result.message).toBe('Hot');
expect(result.alertClass).toBe('alert-danger');
});
});
Your controller doesnt actually have any functionality only the service does. So you shouldnt be testing the service functionality in the controller.
describe('Spec Template', function () {
var scope,
controller,
PlateCheckServiceMock = {
checkPlate: function () {}
};
beforeEach(function () {
module('cs');
inject(function ($rootScope, $controller, $q) {
scope = $rootScope.$new();
spyOn(PlateCheckService, 'checkPlate').andCallThrough();
controller = $controller('PlateCheckCtrl', {
$scope: scope,
PlateCheckService: PlateCheckServiceMock
}
});
});
});
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments