角度2 - ルータでのユニットテスト

Question

角度2.0.0では、私はルータを使用するコンポーネントをユニットテストしています。しかし、私は '提供されたパラメータが呼び出しターゲットの署名と一致しません。'エラー。 spec.tsのVisualスタジオコードでは、赤でハイライト表示された新しいRouter（）です

正しい構文が何であるか教えていただけたらと感謝しています。前もって感謝します。私のコードは次のとおりです。

spec.ts

import { TestBed, async } from '@angular/core/testing'; 
import { NavToolComponent } from './nav-tool.component'; 
import { ComponentComm } from '../../shared/component-comm.service'; 
import { Router } from '@angular/router'; 

describe('Component: NavTool',() => { 
    it('should create an instance',() => { 
    let component = new NavToolComponent(new ComponentComm(), new Router()); 
    expect(component).toBeTruthy(); 
    }); 
}); 

コンポーネントのコンストラクタ

constructor(private componentComm: ComponentComm, private router: Router) {} 

Answer 1

をRouteは、そのコンストラクタに渡された期待し、いくつかの依存関係を持っているためです。

角度コンポーネントを使用している場合は、単独のテストを行うべきではありません。テスト環境を準備するには、Angularテストインフラストラクチャを使用する必要があります。これは、すべてを作成しようとするのではなく、にの必要な依存関係を注入させるように、Angularにコンポーネントを作成させることを意味します。

はあなたが始めるために、

import { TestBed } from '@angular/core/testing'; 

describe('Component: NavTool',() => { 
    let mockRouter = { 
    navigate: jasmine.createSpy('navigate') 
    }; 
    beforeEach(() => { 
    TestBed.configureTestingModule({ 
     declarations: [ NavToolComponent ], 
     providers: [ 
     { provide: Router, useValue: mockRouter }, 
     ComponentComm 
     ] 
    }); 
    }); 
    it('should click link',() => { 
    let fixture = TestBed.createComponent(NavToolComponent); 
    fixture.detectChanges(); 
    let component: NavToolComponent = fixture.componentInstance; 
    component.clickLink('home'); 
    expect(mockRouter.navigate).toHaveBeenCallWith(['/home']); 
    }); 
}); 

またはそのような何かのようなものを持っている必要があります。 TestBedを使用して、テスト用にモジュールを最初から構成します。あなたは@NgModuleとほぼ同じように設定します。

ここでは、ルータを嘲笑しています。単なる単体テストなので、実際のルーティング機能は欲しくないかもしれません。正しい引数で呼び出されるようにしたいだけです。モックとspyは私たちのためにその呼び出しをキャプチャすることができます。

を実行する場合実際のルータを使用する場合は、RouterTestingModuleを使用してルートを設定する必要があります。角度テストインフラストラクチャを使用してより多くの例のために

• Angular docs on Testing：hereと

  here関連項目の例を参照してください。

あなたはまた、単にRouterTestingModuleと、このような単なるspyOnナビゲート機能を使用することができます

Answer 2

...

import { TestBed } from '@angular/core/testing'; 
import { RouterTestingModule } from '@angular/router/testing'; 

import { MyModule } from './my-module'; 
import { MyComponent } from './my-component'; 

describe('something',() => { 

    let fixture: ComponentFixture<LandingComponent>; 

    beforeEach(() => { 

     TestBed.configureTestingModule({ 
      imports: [ 
       MyModule, 
       RouterTestingModule.withRoutes([]), 
      ], 
     }).compileComponents(); 

     fixture = TestBed.createComponent(MyComponent); 

    }); 

    it('should navigate',() => { 
     let component = fixture.componentInstance; 
     let navigateSpy = spyOn((<any>component).router, 'navigate'); 

     component.goSomewhere(); 
     expect(navigateSpy).toHaveBeenCalledWith(['/expectedUrl']); 
    }); 
});