Angular单元测试的spyOn使用一例

待测试的Component里有一个Observable数组：

通过下面的代码赋值：

this.checkoutDeliveryService.getSupportedDeliveryModes();

checkoutDeliveryService的类型：CheckoutDeliveryService

在单元测试时，我们需要将CheckoutDeliveryService的实际实现隔离开，通过创建MockCheckoutDeliveryService实现。

首先在单元测试里创建一个mockcheckoutDeliveryService实例：

创建一个MockCheckoutDeliveryService类：

class MockCheckoutDeliveryService {
  loadSupportedDeliveryModes = createSpy();
  setDeliveryMode = createSpy();
  getSupportedDeliveryModes(): Observable<DeliveryMode[]> {
    return of();
  }
  getSelectedDeliveryMode(): Observable<DeliveryMode> {
    return of();
  }
  getLoadSupportedDeliveryModeProcess(): Observable<LoaderState<void>> {
    return of();
  }
}

其方法同真实的CheckoutDeliveryService类方法一致，差别在于返回的是空的Observable对象。

在TestBed.configureTestingModule的providers配置里，使用class MockCheckoutDeliveryService来注入CheckoutDeliveryService:

通过TestBed.inject得到mockCheckoutDeliveryService的实例：

使用spyOn代码将mockCheckoutDeliveryService类的方法getSupportedDeliveryModes的返回值设置成of(mockSupportedDeliveryModes):

这样，在单元测试执行时，Component调用checkoutDeliveryService的getSupportedDeliveryModes方法时，会自动返回我们在spyOn里指定的值。