角單元測試，是什麼導致$ rootScope。$ watch（）觸發？

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; 
     } 
    } 
})(); 

這是我的測試套件（因果報應，茉莉） 描述（ 'NavController功能'，函數（）{

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); 
    })); 
});}); 

我期待有運行$範圍。$摘要（ ）爲了激發觀察者，讓init（）運行，但它運行正常並且測試通過。

這不是問題，我只是想了解它爲什麼運行，因爲我不明白觀察者如何射擊？是什麼導致它運行？

Answer 1

在我看來，在全球範圍內初始化控制器是一個壞主意。這是因爲，在未來，當您想測試其他邏輯獨立的控制器時，您仍然會爲每個it()塊初始化每個控制器，我認爲沒有理由這麼做。

至於爲什麼你$watch被炒魷魚，你設置jsDictionary爲$rootScope和初始化它爲每個it()塊。在你的控制器代碼中，對於$watch，你只是檢查值是否存在，它將如你在前面的行中設置它，因此它調用init()塊。使用$手錶的正確的方法是：

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

做的是創建爲每個控制器一個describe()塊的一種更好的方式，把你的beforeEach()東西describe()，也是你的it()塊內，那些與該特定控制器相關。這也可以幫助您構建模塊化測試用例。