角度2で解決ルートをテストするにはどうすればよいですか？

Question

私は、ルータのイベントにサブスクライブされていると私は、コードの一部を模擬する方法がわからない、単純なコンポーネントをテストしようとしています。エラーは次のとおりです：未定義のプロパティ 'pairwise'を読み取ることができません。

未定義

のプロパティ 'ペアワイズ' を読み取ることができません。これは私のテストで：

describe('AppComponent', function() { 
    let fixture: ComponentFixture<AppComponent>; 
    var tendersServiceStub = {}; 
    var scrollServiceStub = {}; 
    var routerStub = {}; 

    beforeEach(async(() => { 
     TestBed.configureTestingModule({ 
      declarations: [AppComponent], 
      providers: [ 
       {provide: TendersService, useValue: tendersServiceStub}, 
       {provide: ScrollService, useValue: scrollServiceStub}, 
       {provide: Router, useValue: routerStub} 
      ], 
      imports: [RouterTestingModule], 
      schemas: [NO_ERRORS_SCHEMA] 
     }).compileComponents().then(() => { 
      fixture = TestBed.createComponent(AppComponent); 
      fixture.detectChanges() 
     }); 
    })); 

    it('should instantiate component',() => { 
     // console.log(fixture); UNDEFINED 
    }); 
}); 

そして、これはコンポーネントです：

export class AppComponent { 
    appTitle: string = 'Magic'; 

    constructor(private router: Router, private tendersService: TendersService, private scrollService: ScrollService) { 
     this.router.events.pairwise().subscribe((e) => { 
      if ((e[0] instanceof NavigationEnd) && (e[1] instanceof NavigationStart)) { 
       this.resetSearchCache(e); 
      } 
     }) 
    } 

    private resetSearchCache(e: any) { 
     if ((e[1].url == '/home') || (e[1].url == '/advancedSearch')) { 
      if (!e[0].url.includes('/detail')) { 
       //DO SOMETHING 
      } 
     } 
    } 

} 

任意のアイデア？

ありがとうございます。

Answer 1

あなただけeventsプロパティを追加し、イベント配列を発する値Observableを作ることができます。

import 'rxjs/add/observable/of'; 

let mockRouter = { 
          // see notes below. this may be incorrect 
    events: Observable.of([ new NavigationStart(1, '/'), 
          new NavigationEnd(1, '/', '/home')]) 
}; 

はNavigationEnd、NavigationStart、およびRoutesRecognizedにもドキュメントを参照してください。私がテストしたところでは、配列が実際に開始イベントに[NavigationStart, RoutesRecognized]で構成され、終了イベントに[RoutesRecognized, NavigationEnd]。したがって、あなたのロジックは正しくないかもしれません。

他のオプションは、本物のルーティングを使用することです。時にはこれが有益な場合もあり、実際にセットアップするのは難しいことではありません。たとえば、あなたのケースでは、homeルートに行くテストにダミーコンポーネントを追加するだけです。そして、これによりRouterTestingModule.withRoutes

@Component({ 
    template: ` 
    ` 
}) 
class HomeComponent {} 

describe('WelcomeComponent',() => { 
    let fixture: ComponentFixture<AppComponent>; 
    let component: AppComponent; 
    let router: Router; 

    beforeEach(() => { 
    TestBed.configureTestingModule({ 
     imports: [ RouterTestingModule.withRoutes([ 
     { path: '', redirectTo: 'home', pathMatch: 'full' }, 
     { path: 'home', component: HomeComponent } 
     ])], 
     declarations: [ AppComponent, HomeComponent ], 
    }); 
    fixture = TestBed.createComponent(TestComponent); 
    component = fixture.componentInstance; 
    router = TestBed.get(Router); 
    router.initialNavigation(); 
    }); 
}); 

でルートを設定、最初のルートイベントがトリガされます。また、他の場所をナビゲートして、Routerで他のイベントを手動でトリガーすることもできます。