मैं आरसी 3 राउटर पर निर्भर इकाइयों का परीक्षण कैसे कर सकता हूं?

Question

मैं यूनिट परीक्षण प्राप्त करने की कोशिश कर रहा हूं जो "नए नए" राउटर के साथ काम कर रहे आरसी 1 के साथ काम करता है। मैं इसे 3.0.0-alpha.8 पर कैसे प्राप्त कर सकता हूं?

मेरे निर्भरता:

"@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", 

---

घटक कि मैं परीक्षण करना चाहते हैं 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

इससे पहले, RC1 के साथ, मैं करने के लिए कुछ इस तरह उपयोग कर रहा था मेरी घटक इकाई का परीक्षण:

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'); 
      }); 
     }) 
    )); 
}); 

जब मैं सिर्फ @angular/router से ROUTER_DIRECTIVES आयात करने के लिए @angular/router-deprecated से routerLink आयात स्विच करने का प्रयास, मैं एक त्रुटि प्राप्त:

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

सभी प्रलेखन मैं "नया नया" रूटर और createPlatform संदेश परीक्षण के बारे में ऑनलाइन प्राप्त कर सकते हैं ROUTER_FAKE_PROVIDERS जो दिखाई प्रदान करने के लिए संदर्भित करता है रों rc2 में शामिल किए जाने, लेकिन rc3 साथ चला गया:

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

node_modules/@angular/router फ़ोल्डर में संकलित .d.ts फ़ाइलों के माध्यम से खोज रहा है, मैं भी नहीं कोई संदर्भ परीक्षण करने के लिए// नकली का मजाक उड़ाता मिला।

क्या कोई भी आरसी 3 में माइग्रेट हुआ और अभी तक यह काम कर रहा है?

Answer 1

आरसी 3 (3.0.0-अल्फा। *) राउटर का परीक्षण करने के लिए, आपको पिछले कुछ संस्करणों में राउटर की स्थापना के तरीके से अलग-अलग चीजों को करने की आवश्यकता है।

आप एक RouterConfig इस तरह परिभाषित करने की जरूरत:

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

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

export const APP_ROUTE_PROVIDERS = [ 
    provideRouter(APP_ROUTES) 
]; 

अपने परीक्षण फ़ाइल में

तो

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

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

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

describe(){ 
    // etc 
} 

आपके रूटर अब परीक्षण योग्य है।

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 
}