如何在 AngularJS 测试中避免“$digest already in progress”错误？

Question

我在使用 Chrome 在 Karma 中运行我的 AngularJS 测试之一时遇到问题。该测试在 PhantomJS 中运行。

使用 Chrome 运行测试时出现以下错误：

Chrome 46.0.2490 (Windows 7 0.0.0) ERROR
  Uncaught Error: [$rootScope:inprog] $digest already in progress
  http://errors.angularjs.org/1.3.18/$rootScope/inprog?p0=%24digest
  at C:/dev/unionvms_eu/branches/dev/unionvms-web/bower_components/angular-mocks/angular-mocks.js:275

测试：

describe('todoRestService', function() {

    beforeEach(module('todoApp'));

    //MOCK RESOURCE
    beforeEach(function () {
        var mockResource = {
            todo: function() {
                return {
                    update: function(todoDTO, callback) {
                        callback({
                            code : 200,
                            data: {
                                status : 'CLOSED'
                            }
                        });
                    },
                }
            },
        };

        module(function ($provide) {
            $provide.value('todoRestFactory', mockResource);
        });

    });

    it("updateTodoStatus should send request to backend and return received object", inject(function($rootScope, $log, todoRestService, Todo) {
        var todo = new Todo();
        todo.status = "CLOSED";

        var resolved = false;
        $rootScope.$apply(function(){
            todoRestService.updateTodoStatus(todo).then(function(updatedTodo){
                resolved = true;
                expect(updatedTodo.status).toEqual(todo.status);
            });
        });
        $rootScope.$digest();
        expect(resolved).toBe(true);
    }));

});

代码：

angular.module('todoApp')
    .factory('todoRestFactory',function($resource) {
        return {
            todo : function(){
                return $resource('/app/todo', {}, {
                    update: {method: 'PUT'}
                });
            },
        };
    })
.factory('todoRestService', function($q, $log, todoRestFactory, Todo){

    var updateTodoStatus = function(todo){
        var deferred = $q.defer();
        todoRestFactory.todo().update(todo.DTO(), function(response) {
            if(response.code !== 200){
                deferred.reject("Invalid response status");
                return;
            }
            deferred.resolve(Todo.fromDTO(response.data));
        }, function(error) {
            $log.error("Error updating todo status");
            $log.error(error);
            deferred.reject(error);
        });
        return deferred.promise;
    };

    return {
        updateTodoStatus: updateTodoStatus,
    };
});

如果我从测试中删除$rootScope.$digest();，错误就会消失，但最后一个断言将失败。我怎样才能使测试工作？

Answer 1

您需要检查 $digest 是否已经启动。 你可以这样做

 if(!$scope.$$phase) {
 //do smth here
}

Answer 2

我认为有 3 种方法可以解决这个问题：

• 编写一个如下所示的 safeApply 函数：

  $scope.safeApply = function(fn) {
    var 阶段 = this.$root.$$phase;
    如果（阶段 === '$apply' || 阶段 === '$digest'）{
      if(fn && (typeof(fn) === 'function')) {
        fn();
      }
    } 别的 {
      这个.$apply(fn);
    }
  };

• 你也可以使用safeApply组件

在代码中：

$scope.$safeApply();

• 在$timeout 中调用$apply：

  $timeout($scope.$apply, 0);