Angular Jasmine test response interceptor Angular Jasmine test response interceptor angularjs angularjs

Angular Jasmine test response interceptor


You should structure your interceptor definition using the more recent syntax. Your URL construction should also be in a service so that it can easily be mocked in tests.

.factory('UnauthorizedInterceptor', function($q, $window, OtherService) {  var service = {    responseError: handleUnauthorized  };  return service;  function handleUnauthorized(rejection) {    if (rejection.status === 401) {      $window.location.href = OtherService.getUnauthorizedRedirectURL();    }    return $q.reject(rejection);  }});

Doing so will let you test it just like any other factory without having to worry about the internal implementations of $http interceptors, or having to mock responses with $httpBackend.

describe('Domain.handlers.response', function() {  var $window,      UnauthorizedInterceptor,      OtherService,      redirectUrl = 'someUrl';  beforeEach(module('Domain.handlers'));  beforeEach(function () {    $window = { location: { href: null } };    module(function($provide) {      $provide.value('$window', $window);    });  });  beforeEach(inject(function(_UnauthorizedInterceptor_, _OtherService_) {    UnauthorizedInterceptor = _UnauthorizedInterceptor_;    OtherService = _OtherService_;    spyOn(OtherService, 'getUnauthorizedRedirectURL').andReturn(redirectUrl);  }));  describe('UnauthorizedInterceptor', function() {    it('should be defined', function() {      expect(UnauthorizedInterceptor).toBeDefined();    });    it('should have a handler for responseError', function () {      expect(angular.isFunction(UnauthorizedInterceptor.responseError)).toBe(true);    });    describe('when HTTP 401', function () {      beforeEach(function () {        var rejection = { status: 401 };        UnauthorizedInterceptor.responseError(rejection);      });      it('should set window location', function () {        expect($window.location.href).toBe(redirectUrl);      });    });    describe('when not HTTP 401', function () {      beforeEach(function () {        var rejection = { status: 500 };        UnauthorizedInterceptor.responseError(rejection);      });      it('should not set window location', function () {        expect($window.location.href).not.toBe(redirectUrl);      });    });  });});


Here is an example of the responseError interceptor and the corresponding jasmine spec.

angular.module('interceptorDemo').factory('redirectInterceptor', ['$q', '$window', function($q, $window) {    'use strict';    function handleUnauthorizedAccess(config) {        if (401 === config.status) {            $window.location = '/signIn/';        }        return $q.reject(config);    }    return {        responseError: handleUnauthorizedAccess    };}]);

The interceptor intercepts the ajax request, if the request is failed, then if the status code is 401 then user is redirected to signIn page.

Jasmine spec for the same is:

describe('redirectInterceptor specs', function() {    var redirectInterceptor, $q;    beforeEach(module('interceptorDemo'));    beforeEach(function() {        $window = {            location: {                href: null            }        };        module(function($provide) {            $provide.value('$window', $window);        });    });    beforeEach(inject(function(_redirectInterceptor_, _$q_) {        redirectInterceptor = _redirectInterceptor_;        $q = _$q_;        spyOn($q, 'reject');    }));    describe('redirectInterceptor specs', function() {        it('should redirect to signIn page for unauthorized access', function() {            var response = {                status: 401,                config: {}            };            var promise = redirectInterceptor.responseError(response);            expect($window.location).toBe('/singIn/');            expect($q.reject).toHaveBeenCalled();        });        it('should not redirect to signIn page for error code other than unauthorized access', function() {            var response = {                status: 404,                config: {}            };            var promise = redirectInterceptor.responseError(response);            expect($window.location).toEqual({                href: null            });            expect($q.reject).toHaveBeenCalled();        });    });});

We have spied on the $q so we can also test that the reject is called for the 401 error.