Come posso unità componenti di test che dipendono dal router RC3?

Question

Sto cercando di ottenere i test unitari che hanno funzionato con RC1 lavorando con il "nuovo nuovo" router. Come posso ottenere questo su 3.0.0-alpha.8?

mie dipendenze:

"@angular/common": "2.0.0-rc.3", 
"@angular/compiler": "2.0.0-rc.3", 
"@angular/core": "2.0.0-rc.3", 
"@angular/forms": "0.2.0", 
"@angular/platform-browser": "2.0.0-rc.3", 
"@angular/platform-browser-dynamic": "2.0.0-rc.3", 
"@angular/router": "3.0.0-beta.2", 

---

La componente che vorrei provare che utilizza la direttiva routerLink:

import {ROUTER_DIRECTIVES} from '@angular/router'; 
@Component({ 
    selector: 'app-topmenu', 
    template: require('./app-topmenu.tpl.html'), 
    directives: [ROUTER_DIRECTIVES] 
}) 
export class TopMenu { 

<nav class="app-top-menu"> 
    <a *ngFor="let link of links" [routerLink]="link.route">{{link.text}}</a> 
</nav> 

---

.210

In precedenza, con rc1, stavo usando qualcosa di simile per unità di testare la mia componente:

import {Location} from '@angular/common'; 
import {SpyLocation} from '@angular/common/testing'; 
import {Router, RouteRegistry, ROUTER_DIRECTIVES, ROUTER_PRIMARY_COMPONENT} from '@angular/router-deprecated'; 
import {RootRouter} from '@angular/router-deprecated/src/router'; 

describe('Router link capabilities',() => { 
    beforeEachProviders(() => [ 
     RouteRegistry, 
     { provide: Location, useClass: SpyLocation }, 
     { provide: ROUTER_PRIMARY_COMPONENT, useValue: TestComponent }, 
     { provide: Router, useClass: RootRouter } 
    ]); 

    it('creates routerLinks with the expected URLs', fakeAsync(
     inject([TestComponentBuilder, Location], (tcb: TestComponentBuilder, spyLocation: SpyLocation) => { 
      tcb.overrideTemplate(TestComponent, ` 
       <app-top-menu [links]='[ 
        { text: "A", route: ["/TestA/TestB/TestC"] }, 
        { text: "B", route: ["/TestA", "TestB", "TestC"] } 
       ]'></app-top-menu> 
       <router-outlet></router-outlet> 
      `).createAsync(TestComponent) 
      .then((fixture: ComponentFixture<TestComponent>) => { 
       fixture.detectChanges(); 
       spyLocation.simulateUrlPop('url-a/url-b/url-c'); 
       tick(); 
       fixture.detectChanges(); 
       let nativeLinks: HTMLAnchorElement[] = fixture.nativeElement.querySelectorAll('a'); 

       expect(nativeLinks.length).toBe(2); 
       expect(nativeLinks[0].textContent).toBe('A'); 
       expect(nativeLinks[1].textContent).toBe('B'); 
      }); 
     }) 
    )); 
}); 

Quando provo a passare solo i routerLink importazioni da @angular/router-deprecated a importare ROUTER_DIRECTIVES da @angular/router, ricevo un errore:

ORIGINAL EXCEPTION: Platforms have to be created via `createPlatform`! 

Tutta la documentazione è possibile trovare on-line sul test della "nuova nuova" router e il createPlatform messaggio si riferisce a fornire ROUTER_FAKE_PROVIDERS che appaiono s da inserire nel RC2, ma andato con RC3:

import {ROUTER_FAKE_PROVIDERS} from '@angular/router/testing'; 
//^[ts] Cannot find module '@angular/router/testing'. 

La ricerca attraverso i .d.ts file compilati nella cartella node_modules/@angular/router, ho anche non trovo alcun riferimento a test/prende in giro/falsi.

Qualcuno ha effettuato la migrazione a rc3 e ha funzionato?

Answer 1

Per testare il router RC3 (3.0.0-alpha. *), È necessario fare un paio di cose in modo diverso da come il router è stato impostato nelle versioni precedenti.

è necessario definire un RouterConfig come questo:

import {provideRouter, RouterConfig} from '@angular/router'; 

export const APP_ROUTES : RouterConfig = [ 
    {path: '', component: AppComponent}, 
    // more paths 
]; 

export const APP_ROUTE_PROVIDERS = [ 
    provideRouter(APP_ROUTES) 
]; 

poi nel file di test

import {ActivatedRoute, RouterConfig, Router} from '@angular/router'; 

class MockRouter { createUrlTree() {} } 
class MockActivatedRoute { } 

beforeEachProviders(() => [ 
    provide(Router, { useClass: MockRouter }), 
    provide(ActivatedRoute, { useClass: MockActivatedRoute }), 
]); 

describe(){ 
    // etc 
} 

Il router è ora testabile.

per RC4:

import {ActivatedRoute, RouterConfig, Router} from '@angular/router'; 

class MockRouter { createUrlTree() {} } 
class MockActivatedRoute { } 



describe(){ 
    beforeEach(() => [ 
     addProviders([ 
      provide(Router, { useClass: MockRouter }), 
      provide(ActivatedRoute, { useClass: MockActivatedRoute }), 
     ]); 
    ]); 
    //etc 
}