ジャスミン仕様

Question

におけるルータエラーなしプロバイダ私は、基本的な角度の2成分のための簡単なジャスミンの仕様を記述しようとしていると私はこのエラーを取得しています：

zone.js:388 Unhandled Promise rejection: No provider for Router! ; Zone: ProxyZone ; Task: Promise.then ; Value:

が、私はこれをどのように修正すればよいですか？

マイジャスミン試験：

import 'zone.js/dist/long-stack-trace-zone.js'; 
import 'zone.js/dist/async-test.js'; 
import 'zone.js/dist/fake-async-test.js'; 
import 'zone.js/dist/sync-test.js'; 
import 'zone.js/dist/proxy.js'; 
import 'zone.js/dist/jasmine-patch.js'; 

import { ComponentFixture, TestBed } from '@angular/core/testing'; 
import { 
    BrowserDynamicTestingModule, 
    platformBrowserDynamicTesting 
} from '@angular/platform-browser-dynamic/testing'; 
import { By } from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 

import { MiddleRowComponent } from './middle-row.component'; 
import { CirclesComponent } from './circles.component'; 
import { ButtonComponent } from '../../shared/subcomponents/button.component'; 
import { Router } from '@angular/router'; 

let comp: MiddleRowComponent; 
let fixture: ComponentFixture<MiddleRowComponent>; 
let de: DebugElement; 
let el: HTMLElement; 

describe('MiddleRowComponent',() => { 
    var fixture: any; 
    var comp: any; 
    beforeAll(() => { 
     TestBed.resetTestEnvironment(); 
     TestBed.initTestEnvironment(BrowserDynamicTestingModule, 
      platformBrowserDynamicTesting()); 
    }); 

    beforeEach((done) => { 
     TestBed.configureTestingModule({ 
      declarations: [MiddleRowComponent, CirclesComponent, ButtonComponent], // declare the test component 
      providers: [Router] 
     }).compileComponents().then(() => { 
      fixture = TestBed.createComponent(MiddleRowComponent); 
      comp = fixture.componentInstance; // MiddleRowComponent test instance 
      // query for the title <h1> by CSS element selector 
      de = fixture.debugElement.query(By.css('h1')); 
      el = de.nativeElement; 
      done(); 
     }); 
    }); 

    it('should display original title',() => { 
     fixture.detectChanges(); 
     expect(el.textContent).toContain(comp.word); 
    }); 

    it('should display a different test title',() => { 
     comp.word = 'Test Title'; 
     fixture.detectChanges(); 
     expect(el.textContent).toContain('Test Title'); 
    }); 
}); 

編集：

は、私は私のスペックは、ルーターを使用しない参照してください。どこのルータをプロバイダとして追加しますか？

import { Component } from '@angular/core'; 
import { Router } from '@angular/router'; 

@Component({ 
    selector: 'middle-row', 
    templateUrl: 'app/landing-page/subcomponents/middle-row.component.html', 
    styleUrls: ['app/landing-page/subcomponents/middle-row.component.css'] 
}) 
export class MiddleRowComponent { 
    public word: string = "stuff"; 
    private isGreen: boolean; 
    constructor(private router: Router) { }; 

    private tryNowClick(): void { 
     this.router.navigateByUrl('/find'); 
    }; 

    private onWordChanged(event: any): void { 
     this.isGreen = event.isGreen; 
     this.word = event.word; 
    } 
} 

Answer 1

あなたが何かしたいルータ：

let mockRouter:any; 
    class MockRouter { 
     //noinspection TypeScriptUnresolvedFunction 
     navigate = jasmine.createSpy('navigate'); 
    } 





describe('Example Test',() => { 
     beforeEach(async(() => { 
        mockRouter = new MockRouter(); 
        TestBed.configureTestingModule({ 
         imports: [ AppModule ], 
         providers: [ { provide: Router, useValue: mockRouter }], 
        }) 

Answer 2

ルータは、このようなプロバイダーのフィールドを含むようにその後、TestBed.configureTestingModulebeforeEachにおけるニーズを使用している場合：

providers: [ { provide: Router, useClass: class { navigate = jasmine.createSpy("navigate"); } }] 

例：あなたは、実際の値を使用する必要がある場合

beforeEach((done) => { 
     TestBed.configureTestingModule({ 
      declarations: [MiddleRowComponent, CirclesComponent, ButtonComponent], // declare the test component 
      providers: [ { provide: Router, useClass: class { navigate = jasmine.createSpy("navigate"); } }] 

     }).compileComponents().then(() => { 
      fixture = TestBed.createComponent(MiddleRowComponent);