如何测试已订阅Observable（throwError）的错误抛出场景？

问题根源 #

1. toThrow 仅能断言同步函数抛出的错误，而Observable的错误是在异步订阅流中触发的，无法被同步断言捕获。
2. 你的handleChange方法中未处理subscribe的错误回调，导致错误直接冒泡到测试框架，触发Jasmine的未捕获错误告警。

最优解决方案：在业务代码中添加错误处理（推荐） #

生产环境中未处理的Observable错误会导致控制台报错，甚至影响应用稳定性，因此首先要完善业务代码的错误处理逻辑，同时这也会让测试更易编写。

修改组件的handleChange方法，添加subscribe的错误回调：

public handleChange(event: any) {
  this.service.saveSomething(event)
    .pipe(takeUntil(this.ngUnsubscribe))
    .subscribe({
      // 如有成功逻辑可在此添加
      error: (err) => {
        this.toastService.showToast('保存失败', err.message);
        // 其他自定义错误处理逻辑
      }
    });
}

对应的测试用例编写（使用fakeAsync + tick确保异步流执行完成）：

let dataMock = {};

it('should trigger error handling on save failure', fakeAsync(() => {
  const testError = new Error('test error');
  // 模拟service抛出错误
  spyOn(service, 'saveSomething').and.returnValue(throwError(testError));
  // 监听toastService的调用
  spyOn(toastService, 'showToast');

  // 触发组件方法
  component.handleChange(dataMock);
  // 触发Observable流的所有异步操作
  tick();

  // 断言service被正确调用
  expect(service.saveSomething).toHaveBeenCalledOnceWith(dataMock);
  // 断言错误处理逻辑执行
  expect(toastService.showToast).toHaveBeenCalledOnceWith('保存失败', testError.message);
}));

临时方案：不修改业务代码时的测试技巧（不推荐） #

如果暂时无法修改业务代码，可通过在测试中拦截错误流来避免Jasmine报错，同时验证逻辑：

let dataMock = {};

it('should handle save error without modifying component code', (done) => {
  const testError = new Error('test error');
  
  // 模拟service返回错误Observable，并在错误触发后完成测试
  spyOn(service, 'saveSomething').and.callFake(() => {
    return throwError(testError).pipe(
      tap({
        error: () => {
          expect(service.saveSomething).toHaveBeenCalledOnceWith(dataMock);
          // 如有其他错误处理逻辑，在此断言
          done();
        }
      })
    );
  });

  component.handleChange(dataMock);
});

关键说明 #

• 避免使用waitForAsync：waitForAsync主要用于处理Angular的异步操作（如HttpClient请求），而throwError是同步触发的Observable错误，fakeAsync + tick更适合这类场景。
• 不要为了测试暴露Observable：业务代码的封装性无需破坏，通过完善错误处理和模拟依赖即可完成测试。

内容的提问来源于stack exchange，提问作者rklec