承诺不在Jasmine中解决 - AngularJS

时间:2016-12-25 17:03:56

标签: angularjs unit-testing jasmine

我试图在用户确认后测试从列表中删除项目的方法。

控制器:

app.controller('mainCtrl', ['$scope', '$window', 'dataService', function($scope, $window, dataService) {
  var vm = this;

  vm.delete = function(id, index) {
    if($window.confirm('Are you sure?')) {
      dataService.deleteById(id).then(function() {
        vm.list.splice(index, 1)
      });
    }
  };
}]);

SEVICE:

app.service('dataService', ['$http', function($http) {
  this.deleteById = function(id) {
    return $http.delete('delete-item?id=' + id);
  };
}]);

测试

describe('Testing RecipesController', function() {
  var scope, ctrl, dataServiceMock, q, deferred, window;

  beforeEach(function() {
    dataServiceMock = {
      deleteById: function() {
        deferred = q.defer();
        return deferred.promise;
      }
    };
  });

  beforeEach(function() {
    module('app');
    inject(function($rootScope, $controller, $q, $window) {
      q = $q;
      window = $window;
      scope = $rootScope.$new();
      ctrl = $controller('mainCtrl', {
        $scope: scope,
        dataService: dataServiceMock
      });
    });
  });

  it('should delete recipe if the user clicked "OK"', function() {
    spyOn(window, 'confirm').and.returnValue(true);
    spyOn(dataServiceMock, 'deleteById').and.callThrough();

    var item= {
      id: 2,
      name: 'Shirt'
    };

    ctrl.list = ['Hat', 'Shirt'];
    ctrl.delete(item, 1);

    expect(dataServiceMock.deleteById).toHaveBeenCalled();
    expect(ctrl.list.length).toBe(1);
  });
});

我成功地模拟了确认对话框和删除方法,以及检查方法是否被调用甚至通过的测试 但是,promise.then()并不起作用 在我运行测试后,我收到了这条消息"预期2为1"。

1 个答案:

答案 0 :(得分:3)

我确实看到了一件事,那就是你永远不会在数据服务模拟中解决或拒绝你的承诺。尝试将模拟更改为:

beforeEach(function() {
  dataServiceMock = {
    deleteById: function() {
      deferred = q.defer();
      deferred.resolve({ /* whatever data you want to resolve with */ });
      return deferred.promise;
      // You could also shorten this whole mock function to just:
      //    return $q.resolve({ /* some data */ });
    }
  };
});

另外,不要忘记在测试结束时执行$digest()上的$rootScope功能...您实际上是在控制器上执行它{'范围,而不是根范围。

抓住实际的$ rootScope对象 - 将beforeEach更改为:

var $rScope;

beforeEach(function() {
    module('app');
    inject(function($rootScope, $controller, $q, $window) {
      q = $q;
      window = $window;
      $rScope = $rootScope;
      ctrl = $controller('mainCtrl', {
        $scope: $rootScope.$new(),
        dataService: dataServiceMock
      });
    });
});

然后在测试中,在最后的根作用域上执行$digest

it('should delete recipe if the user clicked "OK"', function() {
  // all your test codez...

  $rScope.$digest();
});