angularjs - 如何使用 $setPristine 对 AngularJS Controller 进行单元测试

Question

我有以下 Controller :-

appControllers.controller("TaskAddController", function ($scope, $timeout, taskService) {
    $scope.task = {};
    $scope.messages = {
        error: false
    };

    $scope.actions = {
        save : function() {
            if ($scope.frmAddTask.$valid) {
                taskService.insert($scope.task)
                    .then(
                        function() {
                            $scope.messages.success = true;
                            $scope.task = {};
                            $scope.frmAddTask.$setPristine();

                            $timeout(function() {
                                $scope.messages.success = false;
                            }, 3000);
                        },
                        function() {
                            $scope.messages.error = true;
                        }
                    );
            } else {
                $scope.messages.error = true;
            }
        }
    };
});

通过此单元测试:-

/// <reference path="../../../../src/tasks.web/scripts/angular-1.2.10.js" />
/// <reference path="../../../../src/tasks.web/scripts/angular-route-1.2.10.js" />
/// <reference path="../../../../src/tasks.web/scripts/app.js" />
/// <reference path="../../../../src/tasks.web/scripts/services.js" />
/// <reference path="../../../../src/tasks.web/scripts/controllers.js" />
/// <reference path="../lib/angular/angular-mocks.js" />

describe("TaskAddController", function() {
    var createController, scope, deferred, mockTaskService;

    beforeEach(function () {
        module('appControllers');
        module('appServices');

        inject(function ($rootScope, $q, taskService) {
            scope = $rootScope.$new();

            scope.frmAddTask = {
                $valid: true
            };

            deferred = $q.defer();
            mockTaskService = taskService;

            spyOn(mockTaskService, "insert").andReturn(deferred.promise);
        });

        inject(function ($controller) {
            createController = function () {
                return $controller("TaskAddController", {
                    $scope: scope,
                    taskService: mockTaskService
                });
            };
        });
    });

    it("when actions.save is called then messages.success should be true", function () {
        var task = {
            title: "Title",
            description: "Description"
        };

        createController();
        scope.task = task;
        scope.actions.save();

        deferred.resolve("insert");
        scope.$root.$digest();

        expect(scope.messages.success).toEqual(true);
    });
});

此错误并显示消息 TypeError: 'undefined' is not a function (evaluating '$scope.frmAddTask.$setPristine()')

我认为这是因为单元测试仅测试 Controller ，并且 $scope.frmAddTask 仅在 View 存在时才存在。所以我的问题是如何正确进行单元测试？

Answer 1

是的，通常 $scope.frmAddTask 对象将由 ngForm 指令创建。但是，在本例中，它是由您在测试中创建的:

scope.frmAddTask = {
  $valid: true
};

既然您无论如何都在使用这个模拟对象，我建议删除它的 $setPristine 方法:

scope.frmAddTask = {
  $valid: true,
  $setPristine: function() {}
};