2角度 - [routerLink]

Question

による経路の変化のためのユニットテストにはノーあります..下記 は私のhtmlコード..です

<button md-raised-button class="mat-primary"[routerLink]="['add']"> 
<i class="fa fa-plus" aria-hidden="true"></i> ADD 
</button> 

を材料設計を使用して、経路変更のためのテストケースを記述する必要があるのですどのクラスもボタンに関連付けられており、オンクリック機能は記述されていません。 私はangular2で新しく、テストするための多くのオプションを試しましたが、この種のジャスミンユニットテストケースを作成するにはどうすればよいでしょうか？

Answer 1

あなたは

Angular 2 unit testing components with routerLink

import { Component } from '@angular/core'; 
import { Router } from '@angular/router'; 
import { By } from '@angular/platform-browser'; 
import { Location, CommonModule } from '@angular/common'; 
import { RouterTestingModule } from '@angular/router/testing'; 
import { TestBed, inject, async } from '@angular/core/testing'; 

@Component({ 
    template: ` 
    <a routerLink="/settings/{{collName}}/edit/{{item._id}}">link</a> 
    <router-outlet></router-outlet> 
    ` 
}) 
class TestComponent { 
    collName = 'testing'; 
    item = { 
    _id: 1 
    }; 
} 

@Component({ 
    template: '' 
}) 
class DummyComponent { 
} 

describe('component: TestComponent', function() { 
    beforeEach(() => { 
    TestBed.configureTestingModule({ 
     imports: [ 
     CommonModule, 
     RouterTestingModule.withRoutes([ 
     { path: 'settings/:collection/edit/:item', component: DummyComponent } 
     ]) 
     ], 
     declarations: [ TestComponent, DummyComponent ] 
    }); 
    }); 

    it('should go to url', 
    async(inject([Router, Location], (router: Router, location: Location) => { 

    let fixture = TestBed.createComponent(TestComponent); 
    fixture.detectChanges(); 

    fixture.debugElement.query(By.css('a')).nativeElement.click(); 
    fixture.whenStable().then(() => { 
     expect(location.path()).toEqual('/settings/testing/edit/1'); 
     console.log('after expect'); 
    }); 
    }))); 
});