我有這種方法,我正在嘗試為其撰寫單元測驗。當前的測驗只是要以正確的順序呼叫 spyOn 方法。
handleSave() {
this.saving = true;
this.presenters.presentLoader({
message: "Uploading..."
});
this.loginService.loginToFirebase().subscribe(() => {
Promise.all(
this.credential.inputs.map((input) => this.putStorageItem(input))
)
.then((url) => {
this.presenters.dismissLoader();
this.presenters.presentAlert({
message: 'Successfully Uploaded Identification.',
buttons: ['Ok']
});
this.presenters.dismissModal(true);
this.saving = false
})
.catch((error) => {
this.presenters.dismissLoader();
this.presenters.presentAlert({
message: 'Something went wrong.'
});
this.saving = false
});
})
}
到目前為止,單元測驗適用于 presentLoader 的初始呼叫,但隨后的 dismissLoader(位于 loginToFirebase 可觀察物件內,并且 Promise.all 沒有被呼叫(至少在可觀察物件和承諾解決之前)
在我之前,我模擬了 putStorageItem
component.putStorageItem = (item) => Promise.resolve(true);
In 并用這個模擬了 loginService。
{
provide: LoginService,
useValue: {
loginToFirebase: () => of(true)
}
},
我目前的測驗
it("call handle save should do stuff", () => {
let presenters = TestBed.inject(PresentersService);
spyOn(presenters, 'presentLoader');
spyOn(presenters, 'dismissLoader');
spyOn(presenters, 'presentAlert');
spyOn(presenters, 'dismissModal');
component.handleSave();
expect(presenters.presentLoader).toHaveBeenCalled();
expect(presenters.dismissLoader).toHaveBeenCalled();
expect(presenters.presentAlert).toHaveBeenCalled();
expect(presenters.dismissModal).toHaveBeenCalled();
});
putStorageItem
putStorageItem(input) {
const fileExt = input.file.metadata.name.split('.').slice(-1);
const filepath = ${input.label}.${fileExt}`;
let task;
if(input.file.metadata.isBase64) {
task = this.fireStorage.ref(filepath).put(this.util.b64toBlob(input.file.img), {contentType:input.file.metadata.type, customMetadata:{originalName:input.file.metadata.name}});
} else {
task = this.fireStorage.ref(filepath).put(input.file.img, {contentType:input.file.metadata.type, customMetadata:{originalName:input.file.metadata.name}});
}
input.fileProgress = task.percentageChanges();
return task.then((snapshot) => {
console.log('One success:', input.file)
}).catch((error) => {
console.log('One failed:', input.file, error.message)
});
}
uj5u.com熱心網友回復:
由于您使用的是Observablesand/or promises,因此您需要使用不同的技術進行測驗。這些技術是:
- 茉莉花的
done回呼 async/await和fixture.whenStable()角的waitForAsync和fixture.whenStable()角的fakeAsync和tick角的
您還可以閱讀更多關于 Angular 中的異步測驗的資訊。
我最喜歡的是fakeAsync并且tick我認為它可以在這種情況下幫助你。
// !! wrap the test in a `fakeAsync` so you have better control of promises
it("call handle save should do stuff", fakeAsync(() => {
let presenters = TestBed.inject(PresentersService);
spyOn(presenters, 'presentLoader');
spyOn(presenters, 'dismissLoader');
spyOn(presenters, 'presentAlert');
spyOn(presenters, 'dismissModal');
component.handleSave();
// !! Call tick() to tell the test that before running the
// statements below the tick,
// ensure the promises in the component code have resolved
// since the expect statements rely on them.
tick();
expect(presenters.presentLoader).toHaveBeenCalled();
expect(presenters.dismissLoader).toHaveBeenCalled();
expect(presenters.presentAlert).toHaveBeenCalled();
expect(presenters.dismissModal).toHaveBeenCalled();
}));
tick也可用于確保可subscribe觀察流在繼續之前已完成,但我主要將其用于承諾。
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/484654.html
