測試Angular 1.5組件：如何測試$ onChanges

我想在使用 $componentController服務創建控制器後測試我的組件的$onChanges。但我不知道如何觸發/測試$onChanges。我試圖更改傳遞到$componentController的綁定對象，但更改並未糾正。

但是我能夠做同樣的使用好老$compile & $rootScope：

describe("test component", function() { 

    angular.module('test', []).component('component', { 
     template: '<span>{{$ctrl.text}}</span>', 
     bindings: { 
      'text': '@' 
     }, 
     controller: function() { 

      this.$onChanges = function(changesObj) { 
       console.log("onChanges called", changesObj); 
      } 
     } 
    }) 

    var $compile, $rootScope; 

    beforeEach(module('test')); 
    beforeEach(inject(function (_$rootScope_, _$compile_) { 
     $rootScope = _$rootScope_; 
     $compile = _$compile_; 
    })); 

    it('should call onChanges', function() { 

     var scope = $rootScope.$new() 
     scope.text = 'original text'; 
     var el = $compile('<component text="{{text}}" />')(scope); 
     $rootScope.$apply(); 
     console.log(el.find('span').text()) 

     scope.text = 'text has changed'; 
     $rootScope.$apply(); 
     console.log(el.find('span').text()) 
    }) 
})

我的問題是：與$componentController測試$onChanges的時候，我必須手動調用$onChanges和手動構建changesObj ？

來源

2017-03-01 dragonfly

_「我必須手動調用$ onChanges並手動構建changesObj嗎？」_這實際上是一件好事，你可以做到這一點。所以我很困惑你的問題。 – zeroflagL

是的，我認爲是。它有助於關注您的測試意圖。

如果您嘗試一些最終會觸發onChanges鉤子的高級操作，那麼您實際上是在同時行使Angular和您的代碼的內部行爲。這可能不是你的意圖。

確認您正在使用Angular並希望從此鉤子中指定某些內容，明確地調用它是有道理的。

來源

2017-03-01 16:25:27 ericminio

測試Angular 1.5組件：如何測試$ onChanges

回答

相關問題