RXjs 6 使用 jasmine 进行回调测试答案

【问题标题】：RXjs 6 callbacks testing with jasmineRXjs 6 使用 jasmine 进行回调测试
【发布时间】：2018-07-03 14:39:13
【问题描述】：

这是一个简单的 post 函数，我可以对成功和 catchError 进行单元测试在茉莉花中。是否可以在茉莉花中测试最终确定？即在 finalize 中，我们可以期望加载器被关闭吗？

 post(url,requestData){
    this.http.post(url, requestData).pipe(
          response => this.Response(response),
          catchError((error: Response) => this.Error(error, msg)),
          finalize(() => {
            loader.close();
          })
    }

在 finalize 中，我正在关闭加载程序。我需要对要在 finalize 中调用的关闭加载程序进行单元测试。

【问题讨论】：

标签： rxjs karma-jasmine jasmine2.0 rxjs6 rxjs-pipeable-operators

【解决方案1】：

我一直在努力解决同样的问题。就我而言，我试图在 Angular 中测试拦截器。

我的解决方案是传递一个真正的 Observable 作为模拟。

这是我的实际代码：

@Injectable()
export class SetLoadingService implements HttpInterceptor {

  constructor(@Inject('INotificationLoading') private _INotificationLoading: INotificationLoading) {}

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (req.headers.has('HideLoading')) {
      return next.handle(req);
    } else {
      this._INotificationLoading.openLoading();
      return next.handle(req).pipe(finalize(() => {
        this._INotificationLoading.closeLoading();
      }));
    }
  }
}

这是我的测试：

it('should be show loading', () => {
    const next: any = {
      handle: () => {
        return Observable.create(subscriber => {
          subscriber.complete();
        });
      }
    };
    const requestMock = new HttpRequest('GET', '/test');
    const closeLoadingSpy = spyOn<INotificationLoading>(notification, 'closeLoading');

    service.intercept(requestMock, next).subscribe(() => {
      expect(closeLoadingSpy).toHaveBeenCalled();
    });

    expect(openLoadingSpy).toHaveBeenCalled();

  });

简而言之，我解决了将 Observable.create() 作为方法句柄的返回传递的问题。在您的情况下，您可以将 http mock 的返回设置为 Observable 并设置检查测试所需的期望。

【讨论】：

【解决方案2】：

我有一个案例，我想确保从 Observable 的 finalize 块中调用“删除加载指示器”方法。该服务是自产的，而不是 HTTP，但它返回一个 observable，所以希望你能适应它。我找到的关键是： 1) 测试必须在 fakeAsync() 块中运行。 2）我不得不在（模拟）订阅上调用下一个。 3) 然后我不得不在 observable 上调用 complete()。

所以，我的解决方案基本上是：

it ("should do something in finalize", () => {
  let fakeResult = new Subject<any>();

  // the "stop" method is called in the finalize of the Observable returned from testMethod()
  spyOn(loadingService, "stop");  

  spyOn(service, "testMethod").andReturn(fakeResult);
  component.methodUnderTestThatCallsServiceTestMethod(); // Observable returned here
  fakeResult.next("whatever");  // Observable subscription fired here
  tick();
  fakeResult.complete();  // Observable finalize triggered here
  expect(loadingService.stop).toHaveBeenCalled();
});

【讨论】：