angular.js如何在每次测试中模拟(或存根)xhr请求

all*_*kim 5 angularjs

在角度js单元测试中,我想为每个测试设置xhr响应(在"it"方法中),而不是在beforeEach方法中,但它似乎不起作用.

这有效

describe('ExampleListCtrl', function(){
  var $scope, $httpBackend;

  beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {
    $httpBackend = _$httpBackend_;
    $httpBackend.expectGET('examples').respond([]);   // <--- THIS ONE
    $controller(ExampleListCtrl, {$scope: $scope = $rootScope.$new()});
  }));

  it('should create "examples"  with 0 example fetched', function() {
    expect($scope.examples).toBeUndefined();
    $httpBackend.flush();
    expect($scope.examples).toEqual([]);
  });

});
Run Code Online (Sandbox Code Playgroud)

结果

Executed 8 of 8 SUCCESS (0.366 secs / 0.043 secs)
Run Code Online (Sandbox Code Playgroud)

但是当我将expectGet方法移动到每个方法时,这会失败并出现错误.我不知道为什么.

describe('ExampleListCtrl', function(){
  var $scope, $httpBackend;

  beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {
    $httpBackend = _$httpBackend_;
    $controller(ExampleListCtrl, {$scope: $scope = $rootScope.$new()});
  }));

  it('should create "examples"  with 0 example fetched', function() {
    $httpBackend.expectGET('examples').respond([]);  // <--- MOVED TO HERE
    expect($scope.examples).toBeUndefined();
    $httpBackend.flush();
    expect($scope.examples).toEqual([]);
  });
});
Run Code Online (Sandbox Code Playgroud)

这是错误

....
at /Users/me/app/test/unit/controllers/ExampleListCtrlSpec.js:3:1
      Error: No pending request to flush
at Error (<anonymous>)
at Function.$httpBackend.flush (/Users/me/app/test/lib/angular/angular-mocks.js:1171:34)
at null.<anonymous> (/Users/me/app/test/unit/controllers/ExampleListCtrlSpec.js:14:18)
Run Code Online (Sandbox Code Playgroud)

----编辑----

按照下面的建议,我已将控制器移出beforeEach,并更改了这样的测试,以便我可以多次测试$ httpBackend.expectGET.

describe('ExampleListCtrl', function(){
  var $scope, $rootScope, $httpBackend;

  beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {
    $httpBackend = _$httpBackend_;
    controller = $controller;
    $scope = $rootScope.$new();
  }));

  it('should create "examples" model with 0 example fetched from xhr', function() {
    $httpBackend.expectGET('examples').respond([]);
    controller(ExampleListCtrl, {$scope: $scope});
    $httpBackend.flush();
    expect($scope.examples).toEqual([]);
  });

});
Run Code Online (Sandbox Code Playgroud)

Cai*_*nha 7

发生这种情况是因为一旦你实例化你的控制器,它就会获取$http,因此$httBackend.因此,所有期望都应在要求之前作出.

如果您希望移动$httpBackend.expectGet到规格(it块),那么您需要$controller(ExempleListCtrl, ...在预期之后移动您的.