Angular 6 单元测试与 ngx-translate 依赖项

Question

我有一个angular 6应用程序，其中包含ngx-translate/core@10.0.2.尝试使用具有硬编码值的CustomLoader。但有些事情不太对劲。

测试

class CustomLoader implements TranslateLoader {
getTranslation(lang: string): Observable<any> {
return of({
'DETAILS': {
'PIN_ENTRY': {              
'INPUT': {
'ERRORS': {
'INVALID': 'Blah',
'INELIGIBLE': 'Blah Blah'
}
}
}
}
});
}
}
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ MyComponent ],
imports: [
... // Elided for brevity
TranslateModule.forRoot({
loader: { provide: TranslateLoader, useClass: CustomLoader}
})
],      
})
.compileComponents();
}));

元件

ngOnInit() {
this.translateService.getTranslation('DETAILS.PIN_ENTRY.INPUT').pipe(first()).subscribe(translations => {      
this.errorTranslations = translations['ERRORS'];
});
}

问题是，subscribe内部translate始终是"细节"。PIN_ENTRY。输入'。我还在CustomLoader#getTranslation中添加了一个日志记录语句，以查看它是否已加载，但看不到输出。

我的设置有什么问题？

Answer 1

在测试在可观察量中具有值的组件时，应在测试中使用async或fakeAsync。

我认为fakeAsync可能是您的最佳选择：

describe('...', () => {
it('...', () => {
// create your component
// move forward in time
tick();
expect(component.errorTranslations).toEqual(yourError);
})
})