33

Bir modül (modülüm) oluşturan bir modül oluşturduk ve bir modül oluşturduk ve bu modülün içinde bir bileşen oluşturdum (yeni aşağıdaki cmd komutları kullanarak bileşen): angular2test yeni angular2test cd ngKarma-Jasmine birim test senaryoları yazılırken "Hata: Sağlayıcı için sağlayıcı yok"

, ng ayarlamak ve tüm bileşenler oluşturduktan sonra bileşeni yeni-bileşenli

oluşturmak ng g modülü my-modülü hizmet ng angular2test klasörünün içindeki cmd'den test komutunu çalıştırdık.

import { Component, OnInit } from '@angular/core'; 
import { Router, Routes, RouterModule } from '@angular/router'; 
import { DummyService } from '../services/dummy.service'; 

@Component({ 
    selector: 'app-my-new-component', 
    templateUrl: './my-new-component.component.html', 
    styleUrls: ['./my-new-component.component.css'] 
}) 
export class MyNewComponentComponent implements OnInit { 

    constructor(private router : Router, private dummyService:DummyService) { } 

    ngOnInit() { 
    } 
    redirect() : void{ 
     //this.router.navigate(['/my-module/my-new-component-1']) 
    } 
} 

aşağıda dosya bizim yeni-component.component.spec.ts dosya geçerli:

aşağıda dosya bizim yeni-component.component.ts dosya geçerli:

012: ng testi komutunu çalıştırırken

/* tslint:disable:no-unused-variable */ 
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 
import { By } from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 

import { RouterTestingModule } from '@angular/router/testing'; 
import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; 
import { DummyService } from '../services/dummy.service'; 

import { MyNewComponentComponent } from './my-new-component.component'; 

describe('MyNewComponentComponent',() => { 
    let component: MyNewComponentComponent; 
    let fixture: ComponentFixture<MyNewComponentComponent>; 

    beforeEach(async(() => { 
    TestBed.configureTestingModule({ 
     imports: [RouterTestingModule, NgbModule.forRoot(), DummyService], 
     declarations: [ MyNewComponentComponent ] 
    }) 
    .compileComponents(); 
    })); 

    beforeEach(() => { 
    fixture = TestBed.createComponent(MyNewComponentComponent); 
    component = fixture.componentInstance; 
    fixture.detectChanges(); 
    }); 

    it('should create',() => { 
    expect(component).toBeTruthy(); 
    }); 
}); 

Biz aşağıda cmd hatayı alıyorsanız

Bileşen dosyasını ve spec dosyasını güncelledik. Kod snippet'inin altında memnun bulun.

import { Component, OnInit } from '@angular/core'; 
import { Router, Routes, RouterModule } from '@angular/router'; 
import { DummyService } from '../services/dummy.service'; 

@Component({ 
    selector: 'app-my-new-component', 
    templateUrl: './my-new-component.component.html', 
    styleUrls: ['./my-new-component.component.css'] 
}) 
export class MyNewComponentComponent implements OnInit { 

    constructor(private router : Router, private dummyService:DummyService, public fb: FormBuilder) { 
    super(fb); 
    } 

    ngOnInit() { 
    } 
    redirect() : void{ 
     //this.router.navigate(['/my-module/my-new-component-1']) 
    } 
} 

aşağıda dosya bizim yeni-component.component.spec.ts dosya geçerli::

aşağıda dosya bizim yeni-component.component.ts dosya olduğunu

Ancak ng test komutunu çalıştırırken, aşağıdaki hatayı alıyoruz. Test modülünü kurarken

09 12 2016 09:13:48.987:WARN [karma]: No captured browser, open http://localhost:9876/ 
09 12 2016 09:13:49.008:INFO [karma]: Karma v1.2.0 server started at http://localhost:9876/ 
09 12 2016 09:13:49.010:INFO [launcher]: Launching browser Chrome with unlimited concurrency 
09 12 2016 09:13:49.420:INFO [launcher]: Starting browser Chrome 
09 12 2016 09:13:58.642:INFO [Chrome 54.0.2840 (Windows 7 0.0.0)]: Connected on socket /#QZ9LSSUVeK6KwNDlAAAA with id 46830907 
     Failed: Unexpected value 'FormBuilder' imported by the module 'DynamicTestModule' 
     Error: Unexpected value 'FormBuilder' imported by the module 'DynamicTestModule' 

cevap

69

Sen RouterTestingModule ithalat gerekir.

/* tslint:disable:no-unused-variable */ 
    import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 
    import { By } from '@angular/platform-browser'; 
    import { DebugElement } from '@angular/core'; 

    import { RouterTestingModule } from '@angular/router/testing'; 

    import { MyNewComponentComponent } from './my-new-component.component'; 

    describe('MyNewComponentComponent',() => { 
    let component: MyNewComponentComponent; 
    let fixture: ComponentFixture<MyNewComponentComponent>; 

    beforeEach(async(() => { 
     TestBed.configureTestingModule({ 
     imports: [RouterTestingModule], 
     declarations: [ MyNewComponentComponent ] 
     }) 
     .compileComponents(); 
    })); 

    beforeEach(() => { 
     fixture = TestBed.createComponent(MyNewComponentComponent); 
     component = fixture.componentInstance; 
     fixture.detectChanges(); 
    }); 

    it('should create',() => { 
     expect(component).toBeTruthy(); 
    }); 
    }); 

Düzenleme:

/* tslint:disable:no-unused-variable */ 
    import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 
    import { By } from '@angular/platform-browser'; 
    import { DebugElement } from '@angular/core'; 

    import { RouterTestingModule } from '@angular/router/testing'; 

    import { MyNewComponentComponent } from './my-new-component.component'; 

    // import the service 
    import { DummyService } from '../dummy.service'; 

    // mock the service 
    class MockDummyService extends DummyService { 
    // mock everything used by the component 
    }; 

    describe('MyNewComponentComponent',() => { 
    let component: MyNewComponentComponent; 
    let fixture: ComponentFixture<MyNewComponentComponent>; 

    beforeEach(async(() => { 
     TestBed.configureTestingModule({ 
     imports: [RouterTestingModule], 
     declarations: [MyNewComponentComponent], 
     providers: [{ 
      provide: DummyService, 
      useClass: MockDummyService 
     }] 
     }) 
     .compileComponents(); 
    })); 

    beforeEach(() => { 
     fixture = TestBed.createComponent(MyNewComponentComponent); 
     component = fixture.componentInstance; 
     fixture.detectChanges(); 
    }); 

    it('should create',() => { 
     expect(component).toBeTruthy(); 
    }); 
    }); 
+0

uygulanması olmadan DummyService uzanan MockDummyService DummyService aynı yöntemler böylece sahte anlamsız hale de kullanabilecektir olmaz sahte DummyService ile örnek? – elli0t