角度1.5のコンポーネントの内部で関数をテストする方法

Question

角度1.5のコンポーネントでナビゲーションを作成しました。しかし、テストでは困難に直面しています。私は角度とユニットテストの両方に新しいです。 このコードを検索してくださいPLUNKER

これは私のコンポーネントです。

現在のページに適切なタイトルがあり、次のページに移動しているかどうかをテストしようとしています。

3スペック、2つの障害 1.例外TypeError：プロパティを読み取ることができません 'タイトル' ここ

は、これらのテストを実行中にエラーが取得しています私のテスト-spec.js

 describe("Check if component is defined", function() { 

     beforeEach(module("app")); 

     var $ctrl; 
     var router; 
     var $rootscope; 

     beforeEach(inject(function($componentController) { 
     $ctrl = $componentController("firstComponent", { 
      $router: router, 
      $rootscope: $rootscope 
     }); 
     })); 

     it("are things define properly", function() { 
     expect($ctrl).toBeDefined(); 

     expect($ctrl.goToNextPage).toBeDefined(); 
     }); 

     it("should have proper title", function() { 

     expect($rootscope.title).toBe("Title from Page 1"); 

     }); 

     it("should navigate to next page", function() { 

     expect($ctrl.router.navigate).toHaveBeenCalled(); 

     }); 

    }); 

です定義されていません 2. TypeError：未定義の 'navigate'プロパティを読み取ることができません

Answer 1

テストでエラーが発生しました。

まず、サービス$ componentControllerと$ rootScopeを注入する必要があります。

その後、あなたは$ componentControllerサービス使用して、コントローラをインスタンス化する必要があります。

let bindings = {$router: router}; 
$ctrl = $componentController('firstComponent', null, bindings); 

をそしてあなたには、いくつかの機能をテストすることができます：あなたが持っているナビゲート機能をテストするには

it("are things define properly", function() { 
    expect($ctrl).toBeDefined(); 
    expect($ctrl.goToNextPage).toBeDefined(); 
}); 

をルータ上にスパイを作成するには、関数$ ctrl.goToNextPage（）を実行し、スパイにアサートしてください：

https://plnkr.co/edit/TiuXM5?p=preview

：私はあなたが完全なコードを見ることができ、あなたのPlunkerを更新した

let routerSpy = spyOn(router, "navigate"); 

...//you must instantiate your controller here as shown above 

$ctrl.goToNextPage(); 
expect(routerSpy).toHaveBeenCalled();