Unit Test - $httpBackend

$httpBackend是包含在ngMock中的一个服务, 提供伪后台, 模拟$http请求. 让测试代码不用真的发起网络请求.

$httpBackend实例

图片上传服务依托于阿里云, 在初始化Service的时候需要在后台请求认证信息. 我们的目的就是, 在单元测试的时候, 模拟请求认证信息的过程.

发起请求的代码如下, 简单的$http.get()

applyTokenDo(func){
  return this.$http.get(this.API_SERVER + '/api/upload/aliyun-sts', {
        cache: true
    }).then(result => {
      ...
      func();
    });
}

模拟请求通常经历以下三个步骤

1. 获取$httpBackend服务
2. 定义伪后台的配置
3. 调用$httpBackend.flush();

let uploadService, $httpBackend;
beforeEach(angular.mock.inject($injector => {
    uploadService = $injector.get('uploadService');
    //step1
    $httpBackend = $injector.get('$httpBackend');
    //step2
    $httpBackend.when('GET', `${uploadService.API_SERVER}/api/upload/aliyun-sts`).respond(aliyunRes);
}));
it('should invoke callback with OSS client', () => {
    let spy = jasmine.createSpy('spy');
    uploadService.applyTokenDo(spy);
    //step3
    $httpBackend.flush();
    expect(spy.calls.any()).toBeTruthy();
})

$httpBackend常用方法

1. when 新建一个后端定义
2. expect 新建一个请求期望

when 和 expect都需要4个参数method, url, data, headers, 其中后2个参数可选。都返回一个带respond()方法的对象.
需要注意以下两点:

• method表示http方法, 注意都需要是大写(GET, PUT…)
• url可以为正则或者字符串

它们的区别在于：$httpBackend.expect的伪后台只能被调用一次(调用一次后会被清除), 第二次调用就会报错, 而且$httpBackend.resetExpectations可以移除所有的expect而对when没有影响.

参考

$httpBackend doc