我正在为调用服务OnInit的组件编写单元测试。如果响应是“成功”，则采取一个动作，而另一个则采取“错误”。
测试这两种情况的最佳方法是什么？我已经创建了组件和单元测试的简化版本。在这两种情况下，我都可以轻松地进行测试。
我已经尝试在此处实施解决方案，但是必须停止实施。我也试图抛出一个错误，正如您将在规范和评论中看到的那样。
零件
@Component({
selector: 'app-observer-throw-unit-test',
template: '<p>{{ data }}</p>'
})
export class ObserverThrowUnitTestComponent implements OnInit {
public data: string;
constructor(private _observerThrowService: ObserverThrowService) { }
ngOnInit() {
this._observerThrowService.getData().subscribe(
(data) => {
this.data = data;
},
(error) => {
this.redirect()
}
)
}
redirect() {
this.data = "Redirecting...";
}
}
规格
const data: string = "Lorem ipsum dolor sit amet.";
const ObserverThrowServiceStub = {
error: false,
getData() {
return Observable.create((observer) => {
if(this.error) {
observer.error(new Error());
} else {
observer.next(data);
}
observer.complete();
})
}
}
describe('ObserverThrowUnitTestComponent', () => {
let component: ObserverThrowUnitTestComponent;
let fixture: ComponentFixture<ObserverThrowUnitTestComponent>;
let _observerThrowService: ObserverThrowService;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ObserverThrowUnitTestComponent ],
providers: [
{ provide: ObserverThrowService, useValue: ObserverThrowServiceStub },
]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ObserverThrowUnitTestComponent);
component = fixture.componentInstance;
fixture.detectChanges();
_observerThrowService = TestBed.get(ObserverThrowService);
});
it('should set "data" to "Lorem ipsum dolor sit amet." on success', () => {
expect(component.data).toEqual("Lorem ipsum dolor sit amet.");
});
it('should set "data" on "Redirecting..." on error',() => {
ObserverThrowServiceStub.error = true;
// spyOn(_observerThrowService, "getData").and.returnValue(Observable.throw("error")); // This did not work and returned : TypeError: undefined is not a constructor (evaluating 'Observable_1.Observable.throw("error")') in src/test.ts
spyOn(_observerThrowService, "getData")
expect(component.data).toEqual("Redirecting...");
});
it('should set "data" on "Redirecting..." on error',() => {
// This works after setting error to true in the previous test
spyOn(_observerThrowService, "getData")
expect(component.data).toEqual("Redirecting...");
});
});
我将创建两个模拟-一个引发错误：
class ObserverThrowServiceStub {
getData() {
return Observable.throw(new Error('Test error'));
}
}
并成功返回。
class ObserverSuccessServiceStub {
getData() {
return Observable.from(data);
}
}
然后，不是为所有测试提供相同的模拟服务，而是根据所涉及的测试适当地提供失败/成功的模拟服务（显然，您需要将模块配置移动到可在每个测试中调用的可配置方法中）而不是.beforeEach()代码中。
此处有一篇非常不错的文章，涉及使用Observables测试Angular服务（正是使用此模型）：http : //www.zackarychapple.guru/angular2/2016/11/25/angular2-testing-services.html
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句