Question

这是我的控制器。

(function() {
    'use strict';

    app.controller('NavController', navController);

    function navController($rootScope, $scope, $location, $window, NavFactory) {

        $scope.menuConfig = null;
        $scope.menuItems = [];
        $scope.isActive = isActive;
        $scope.toggleBurgerMenu = toggleBurgerMenu;
        $scope.toggleDeviceSettings = toggleDeviceSettings;

        $rootScope.$watch('dictionary', function(dictionary) {
            if (dictionary) {
                init();
            }
        });

        function init() {
            $scope.menuConfig = $rootScope.config.navigation;
            NavFactory.GetMenuItems().then(onGetMenuItems, $scope.onAPIError);
        }

        function onGetMenuItems(response) {
            $scope.moduleConfig = response.moduleConfig;
            $scope.menuItems = response.menuItems;
        }
    }
})();

这是我的测试套件（业力，茉莉花） describe（'NavController function'，function（）{

var $rootScope, $scope, $location, $window, $controller, createController, NavFactory, CacheFactory, toastr;

beforeEach(module('mockedDashboard'));

beforeEach(inject(function(_$rootScope_, _$controller_, _$location_, _$window_, _NavFactory_, _toastr_) {
    $location = _$location_;
    $window = _$window_;
    toastr = _toastr_;

    $rootScope = _$rootScope_;
    $rootScope.dictionary = jsDictionary;
    $rootScope.config = jsConfig;
    $rootScope.config.contentFolder = '_default';

    $scope = _$rootScope_.$new();
    $scope.burgerMenuActive = false;
    //mock the parent controller function
    $scope.navigate = function(path) {
        $location.path('/' + path);
    };
    // end mock

    createController = function() {
        return _$controller_('NavController', {
            '$scope': $scope
        });
    };
    $controller = createController();
}));

// We are using CacheFactory in this project, when running multiple tests on the controller
// we need to destroy the cache for each test as the controller is initialized for each test.
afterEach(inject(function(_CacheFactory_) {
    CacheFactory = _CacheFactory_;
    CacheFactory.destroy('defaultCache');
}));

describe('init()', function() {

    it('should call NavFactory.GetMenuItems and set moduleConfig and menuItems on $scope', inject(function(_$httpBackend_) {

        var $httpBackend = _$httpBackend_;

        expect($scope.moduleConfig).toBe(undefined);
        expect($scope.menuItems.length).toBe(0);

        var responseData = [{
            "path": "stats",
            "url": "./app/modules/dashboard/modules/score/score.index.html",
            "icon": "fa fa-fw fa-pie-chart",
            "dashboardEnabled": true,
            "burgerMenu": true,
            "barMenu": false,
            "barMenuOrder": -1,
            "bottomMenu": true,
            "bottomMenuOrder": 3,
            "order_sm": 1,
            "order_md": 2,
            "order_lg": 2
        }];

        $httpBackend.expectGET('../content/_default/config/modules.json').respond(responseData);
        $httpBackend.flush();

        expect($scope.moduleConfig).not.toBe(undefined);
        expect($scope.menuItems.length > 0).toBe(true);
    }));
});});

我原本希望运行一个$ scope。$ digest（）来激活观察者，让init（）运行，但它运行正常并且测试通过。

这不是问题，我只是想了解它为什么会运行，因为我不明白观察者是如何开火的？是什么导致它运行？

Answer 1

在我看来，在全局范围内初始化控制器是个坏主意。这是因为，在将来，当您想要测试逻辑上独立的其他控制器时，您仍然会为每个it()块初始化每个控制器，我认为没有理由这样做。

至于您的$watch被解雇的原因，您将jsDictionary设置为$rootScope并为每个it()块初始化它。在您的控制器代码中，对于$watch，您只是检查该值是否存在，它将在您之前的行中设置它，因此它会调用init()块。使用$ watch的正确方法是：

$rootScope.$watch('dictionary', function(oldVal, newVal){
});

更好的做法是为每个控制器创建一个describe()块，将beforeEach()内容放在describe()和it()块内，与该特定控制器有关。这也可以帮助您构建模块化测试用例。

角度单元测试，是什么导致$ rootScope。$ watch（）开火？

1 个答案: