如何在不崩溃的情况下模拟 Observable 的错误？答案

【问题标题】：How to mock an error from Observable without crashing?如何在不崩溃的情况下模拟 Observable 的错误？
【发布时间】：2018-06-13 00:15:28
【问题描述】：

我有一个模拟服务

export class DataServiceStub {

  numbers$ = of([1,2,3,4,5,6]).pipe(
    switchMap((data: number[]) => {
      if (this._error) {
        return throwError(this._error);
      }
      return of(data);
    });

  private _error: string;

  setError(msg: string) {
    this._error = msg;
  }

}

我将在使用该服务的组件中测试错误案例

it('should show an error message', async(() => {
    const errorMessage = `Fetch data error`;
    testDataService.setError(errorMessage);
    // spyOnProperty(dataStub, 'numbers$').and.returnValue(throwError(errorMessage));
    fixture.detectChanges();
    const compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('.error').textContent).toContain(errorMessage);
}));

组件看起来像这样

@Component({
  selector: 'app-root',
  template: `
    <div *ngFor="let num of numbers$ | async">...</div>
    <div *ngIf="error$ | async as error" class="error">{{error}}</div>
  `
})
export class AppComponent {
  numbers$ = this._dataService.numbers$;
  error$ = this._dataService.numbers$.pipe(
    filter(() => false),
    catchError((error: string) => of(error))
  );
}

但是错误会影响整个测试过程。

我怎样才能避免这样的结果？

【问题讨论】：

标签： angular unit-testing error-handling karma-jasmine angular-test

【解决方案1】：

我找到了一个解决方案但它很难看

  it('should show an error message', fakeAsync(() => {
    const errorMessage = `Fetch data error`;
    spyOnProperty(dataStub, 'numbers$').and.returnValue(throwError(errorMessage));
    fixture.detectChanges();
    const compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('.error').textContent).toContain(errorMessage);

    // Oh my god! it's a super ugly stuff 
    const _tick = () => {
      try {
        tick();
      } catch (e) {
        _tick();
      }
    };
   _tick();

  }));

请不要打我:)

该解决方案的灵感来自Async test with fakeAsync()

也许有人可以改进它...

【讨论】：

【解决方案2】：

真正的解决方案很简单：我必须捕获所有可能的异常 :)

之后不需要丑陋的黑客攻击。

【讨论】：