angular js karma/chai - 模拟授权错误

Question

我是 TDD 的新手，正在 angular js 中测试 authInterceptor（我有 chai/mocha/sinon 可用），它有两个函数，一个请求和一个 responseError。我成功测试了请求函数，但我不知道如何（搜索文档）模拟 401（未经授权）错误。这是拦截器：

 export default function AuthInterceptor($q, $injector, $log) {
  'ngInject';

  return {
    request(config) {
      let AuthService = $injector.get('AuthService');
      if (!config.bypassAuthorizationHeader) {
        if (AuthService.jwtToken) {
          config.headers.Authorization = `Bearer ${AuthService.jwtToken}`;
        } else {
          $log.warn('Missing JWT', config);
        }
      }
      return config || $q.when(config);
    },
    responseError(rejection) {
      let AuthService = $injector.get('AuthService');
      if (rejection.status === 401) {
        AuthService.backToAuth();
      }
      return $q.reject(rejection);
    }
  };

}

这是我的四项测试。前三个 'it' 块成功通过，第四个是我卡住的地方，我在那个 "it" 块中添加了注释：

    import angular from 'angular';
import AuthInterceptor from './auth.interceptor'

describe('Auth interceptor test', () => {

  describe('AuthInterceptor test', () => {
    let $httpBackend, $http, authInterceptor = AuthInterceptor();

    beforeEach(angular.mock.module(($httpProvider, $provide) => {
      $httpProvider.interceptors.push(AuthInterceptor);
      $provide.factory('AuthService', () => ({
        jwtToken: "hello",
        backtoAuth: angular.noop
      }));
    }));

    beforeEach(inject(function($injector) {
      $httpBackend = $injector.get('$httpBackend');
      $http = $injector.get('$http');
    }))


    it('should have a request function', () => {
      let config = {};
      expect(authInterceptor.request).to.be.defined;
      expect(authInterceptor.request).to.be.a('function');

    })

    it('the request function should set authorization headers', (done) => {
      $httpBackend.when('GET', 'http://jsonplaceholder.typicode.com/todos')
        .respond([{
          id: 1,
          title: 'Fake title',
          userId: 1
        }]);
      $http.get('http://jsonplaceholder.typicode.com/todos').then(function(transformedResult) {

        expect(transformedResult.config.headers.Authorization).to.be.defined;
        expect(transformedResult.config.headers.Authorization).to.contain('Bearer')
        done();
      })
      $httpBackend.flush();
    });

    it('should have a responseError function', () => {
      expect(authInterceptor.responseError).to.be.defined;
      expect(authInterceptor.responseError).to.be.a('function');
      //TODO: test return value
      // see that AuthService.backToAuth()
    })

     it('the error function should call backtoAuth', (done) => {
  //a url that doesn't give me a 401 like I'm hoping.
  $httpBackend.when('POST', 'https://wwws.mint.com/overview.event').respond([
    //what do I do here?
  ])
  $http.post('https://wwws.mint.com/overview.event').then(function(transformedResult) {

    console.log("success", transformedResult);
    done();
  }, function(error){
    // I can't seem to get in here. if I can, the responseError should be called, which in turn calls backToAuth...
    console.log("error", error);
    done();
  })
  $httpBackend.flush();
});

Answer 1

第一个respond参数是status，应该是

  $httpBackend.when('POST', 'https://wwws.mint.com/overview.event').respond(401);

在存根方法中使用 Sinon/Jasmine spies/stubs 代替 noop 总是好的，因此可以测试它们的调用：

var sandbox;

beforeEach(() => {
  sandbox = sinon.sandbox.create();
});

afterEach(() => {
  sandbox.restore();
});

beforeEach(angular.mock.module(($httpProvider, $provide) => {
  $httpProvider.interceptors.push(AuthInterceptor);
  $provide.factory('AuthService', () => ({
    jwtToken: "hello",
    backtoAuth: sandbox.stub();
  }));
}));

angular js karma/chai - 模拟授权错误

angular js karma/chai - mock an authorization error

unit-testing

mocha.js

sinon

angularjs

chai