How can I define a global $httpBackend for servicesSpec and controllersSpec in AngularJS? - testing

Question

My controller relies on a service which does http requests.
Both controller and service tests require the httpBackend with the same data. Do you have any idea of a workaround?

Answer 1

I imagine your code looks like this:
angular.module('MyApp', [])
.controller('MyCtrl', function($scope, MyService) {
$scope.doSomething = function() {
MyService.doSomething();
};
})
.service('MyService', function($http) {
$http.get('some-url')
.success(function(response) {
// Handles the response
});
});
In order to unit test MyCtrl you need to mock out its dependencies: $scope and MyService. So in your test you can do this:
describe('MyCtrl', function() {
var MyServiceMock,
scope;
beforeEach(function() {
module('MyApp');
// Creates a mock (spy) for MyService
MyServiceMock = jasmine.createSpyObj('MyService', ['doSomething']);
inject(function($provide) {
// Tells Angular to use MyServiceMock instead of MyService
$provide.value('MyService', MyServiceMock);
});
inject(function($controller, $rootScope) {
scope = $rootScope.$new();
$controller('MyCtrl', { $scope: scope });
});
});
it('calls doSomething of MyService', function() {
$scope.doSomething();
expect(MyServiceMock.doSomething).toHaveBeenCalled();
});
});
That way you can test MyCtrl without having to use an actual instance of MyService.
I assume you know how to write tests for MyService using the $httpBackend service, so I won't post the code for it here.