Testing AngularJs' $ http.defaults.headers.common if a specific header is specified

Question

So, I'm new to the world of JavaScript and AngularJS, and so my code is not as good as it should be, but it is improving. However, I began to learn and implement a simple login page using REST Backend. After submitting the login form, the authentication token is returned and set as the default http header property, similar to this

$http.defaults.headers.common['X-AUTH-TOKEN'] = data.authToken; 

This works fine when I check it manually, but it isn’t, so I would like to implement unit-test, which checks if the X-AUTH-TOKEN header is set.

Is there any way to check this with $ httpBackend? For example, I have the following test:

 describe('LoginController', function () { var scope, ctrl, $httpBackend; // Load our app module definition before each test. beforeEach(module('myApp')); // The injector ignores leading and trailing underscores here (ie _$httpBackend_). // This allows us to inject a service but then attach it to a variable // with the same name as the service. beforeEach(inject(function (_$httpBackend_, $rootScope, $controller) { $httpBackend = _$httpBackend_; scope = $rootScope.$new(); ctrl = $controller('LoginController', {$scope: scope}, {$http: $httpBackend}, {$location: null}); })); it('should create an authToken and set it', function () { $httpBackend.expectPOST('http://localhost:9000/login', '200').respond(200, '{"authToken":"52d29fd63004c92b972f6b99;65e922bc-5e33-4bdb-9d52-46fc352189fe"}'); scope.login('200'); $httpBackend.flush(); expect(scope.data.authToken).toBe('52d29fd63004c92b972f6b99;65e922bc-5e33-4bdb-9d52-46fc352189fe'); expect(scope.loginValidationOverallError).toBe(false); expect(scope.status).toBe(200); }); 

My controller is as follows:

 .controller('LoginController', ['$scope', '$http', '$location', function ($scope, $http, $location) { // Login Stuff $scope.data = {}; $scope.status = {}; $scope.loginValidationOverallError = false; $scope.login = function (user) { $http.post('http://localhost:9000/login', user).success(function (data, status) { $scope.data = data; $scope.status = status; $scope.loginValidationOverallError = false; console.log($scope.status, $scope.data); $http.defaults.headers.common['X-AUTH-TOKEN'] = data.authToken; $location.path('/user'); }).error(function (data, status) { console.log(status + ' error'); $scope.loginValidationOverallError = true; }); }; ... 

I checked the documentation at http://docs.angularjs.org/api/ngMock.$httpBackend , but not sure if the last test really applies to my code (and how this code really checks something)

 it('should send auth header', function() { var controller = createController(); $httpBackend.flush(); $httpBackend.expectPOST('/add-msg.py', undefined, function(headers) { // check if the header was send, if it wasn't the expectation won't // match the request and the test will fail return headers['Authorization'] == 'xxx'; }).respond(201, ''); $rootScope.saveMessage('whatever'); $httpBackend.flush(); }); 

Answer 1

I ran into the same problem and I finally solved it. It was very difficult

Sousse code for the Authentication function Service.login ()

 $http.post(...) .success(function(data) { ... $http.defaults.headers.common['Authorization'] = data.oauth_token; }); 

Test code

 beforeEach(inject(function(_$httpBackend_,AuthenticationService) { $httpBackend = _$httpBackend_; $authenticationService = AuthenticationService; })); it('should login successfully with correct parameter', inject(function($http) { // Given ... ... var fakeResponse = { access_token: 'myToken' } $httpBackend.expectPOST('oauth/token',urlEncodedParams, function(headers) { return headers['Content-Type'] === 'application/x-www-form-urlencoded'; }).respond(200, fakeResponse); // When $authenticationService.login(username,password); // Then $httpBackend.flush(); expect($http.defaults.headers.common['Authorization']).toBe('myToken'); 

the trick is that the default header is set in the real $ http service , not the mocked $ httpBackend. That is why you should introduce a real $ http service

I tried testing $ httpBackend but got the error "undefined" because $ httpBackend does not have the defaults property