在ngRx中使用Jest测试Observable<Pizza>涉及几个基础概念,包括ngRx、Observable、Jest以及如何进行单元测试。下面我将详细解释这些概念,并提供相关的示例代码。
假设我们有一个简单的Pizza服务,它返回一个Observable<Pizza>:
// pizza.service.ts
import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';
export interface Pizza {
name: string;
toppings: string[];
}
@Injectable({
providedIn: 'root'
})
export class PizzaService {
getPizzas(): Observable<Pizza[]> {
return of([
{ name: 'Margherita', toppings: ['Tomato', 'Mozzarella'] },
{ name: 'Pepperoni', toppings: ['Pepperoni', 'Cheese'] }
]);
}
}
我们可以使用Jest来测试这个服务:
// pizza.service.spec.ts
import { PizzaService } from './pizza.service';
import { of } from 'rxjs';
import { TestBed } from '@angular/core/testing';
describe('PizzaService', () => {
let service: PizzaService;
beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(PizzaService);
});
it('should be created', () => {
expect(service).toBeTruthy();
});
it('should return a list of pizzas', (done) => {
const expectedPizzas = [
{ name: 'Margherita', toppings: ['Tomato', 'Mozzarella'] },
{ name: 'Pepperoni', toppings: ['Pepperoni', 'Cheese'] }
];
service.getPizzas().subscribe(pizzas => {
expect(pizzas).toEqual(expectedPizzas);
done();
});
});
});
问题: 测试时Observable没有完成,导致测试挂起。
原因: 可能是因为没有正确调用done()
回调或者Observable没有被正确订阅。
解决方法: 确保在测试中正确使用done()
回调,并且Observable被正确订阅。如上面的示例代码所示。
通过这种方式,你可以有效地测试ngRx中的Observable,并确保你的应用状态管理逻辑按预期工作。
领取专属 10元无门槛券
手把手带您无忧上云