2017-03-22 11 views
0

私はまだAngularアプリケーションのテストを書いています。 Orgオブジェクトを変更して変更を保存し、変更が保存されていることを証明するテストがあります。ただし、テストでは変更が表示されません。Angular2、jasmine:テスト仕様関数にコンポーネントの変更がありません

変更を保存します私のモック組織のサービス:

@Injectable() 
export class MockOrgService { 
    constructor() { } 

    public save(org: Org): Observable<Org> { 
    let savedOrg: Org = new Org(org); 
    savedOrg.address2 = 'Saved with id: ' + org.id; 

    return Observable.of(savedOrg); 
    } 

} 

マイモックルータ:テストされている

beforeEach(async(() => { 
    routeStub = { data: Observable.of({ org: org1 }), snapshot: {} } ; 
    TestBed.configureTestingModule({ 
    imports: [ FormsModule, RouterTestingModule ], 
    providers : [ 
     { provide: DialogService, useClass: MockDialogService }, 
     { provide: GlobalsService, useClass: MockGlobalsService }, 
     { provide: OrgService, useClass: MockOrgService }, 
     { provide: ActivatedRoute, useValue: routeStub }   
    ], 
    declarations: [ OrgDetailComponent ], 
    }) 
    .compileComponents(); 
})); 

マイコンポーネント機能:

private gotoParent(): void { 
    this.router.navigate(['../'], { relativeTo: this.route }); 
} 

public save(): void { 
    this.error = null; 
    let that = this; 

    this.orgService 
     .save(that.org) 
     .subscribe(
      (org: Org): void => { 
      that.org = org; 
      that.savedOrg = new Org(org); 
      that.gotoParent(); 
      }, 
      error => this.error = error 
    ); 

} 

私のテスト:

it('responds to the Save click by saving the Org and refilling the component', async(() => { 

    fixture.detectChanges(); 
    fixture.whenStable().then(() => { 
    comp.org.id = 2; 
    comp.org.name = 'Another Org'; 
    let elButton = fixture.debugElement.query(By.css('#save')); 
    elButton.nativeElement.click(); 

    fixture.detectChanges(); 
    fixture.whenStable().then(() => { 
     expect(comp.error).toBeNull(); 
     expect(comp.savedOrg.id).toEqual(2); 
     expect(comp.savedOrg.name).toEqual('Another Org'); 
     expect(routeStub).toHaveBeenCalledWith(['../']); 
    }); 
    });  

私はブレークポイントを使用すると、click()が実行されたときにOrgService.save()が呼び出され、コンポーネントsave()関数でthat.savedOrgが設定されていることがわかります。しかし、テストがexpect()関数に入ると、comp.savedOrgは元の値になります。これは、2つのコンポーネントインスタンスがあるかのようです。

FWIWは、設定した後、または設定しないと、私のsavedOrg my関数がルーティングしようとしました。

Error: Expected a spy, but got Object({ data: ScalarObservable({ _isScalar: true, value: Object({ org: Org({ id: 2, [SNIP] 

私は私が「goToParent」ルーティングが呼び出されていることを伝えるために行うことになってるのかわからないんだけど。私の代わりにエラーが発生します。

ありがとうございました。

ジェローム

答えて

0

私は「テスト仕様機能には見られません」という問題を理解しました。

comp = fixture.componentInstance; 

これは、すべてが正常に同期するようにするための最初のwhenStable()の直後に行がありません。今私はルートテストの作業をする方法を理解する必要があります。それは別の仕事です。

ジェローム。

+0

ここで、ルートテストの仕組みを理解する必要があります。 - >ルータを模擬してくださいhttp://stackoverflow.com/a/42965863/2587435 –

+0

この他のリンクでは、「保存」ボタンのルートテストを含む完全なソリューションを掲載しました。 https://stackoverflow.com/questions/42966123/angular2-how-to-test-a-component-function-that-sometimes-returns-sometimes-rouを参照してください。 –

関連する問題