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

【问题标题】：angular js karma/chai - mock an authorization errorangular js karma/chai - 模拟授权错误
【发布时间】：2016-12-23 11:24:03
【问题描述】：

我是 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”块中添加了 cmets：

    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();
});

【问题讨论】：

标签： angularjs unit-testing mocha.js sinon chai

【解决方案1】：

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

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

在存根方法中使用 Sinon/Jasmine 间谍/存根而不是 noops 总是好的，因此可以测试它们的调用：

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();
  }));
}));

【讨论】：