Angular 4：是否可以使用 HttpClient 进行独立单元测试？答案

【问题标题】：Angular 4: Is it possible to do Isolated Unit Tests with HttpClient?Angular 4：是否可以使用 HttpClient 进行独立单元测试？
【发布时间】：2018-07-15 21:15:16
【问题描述】：

我以为我会关注Angular guide for testing services，但这是一个没有测试的新项目，我们只是切换到使用更新的 HttpClient，我看到的每个示例都使用了所有 TestBed 样板，我认为在让我的测试运行方面给我带来了问题。

有没有办法为使用 HttpClient 的服务编写独立的单元测试？

我想知道的第二部分是最佳实践。我对单元/集成测试还很陌生，在我看到的 HttpClient 示例中，它们都使用 HttpTestingController 返回模拟结果。对于我的应用程序，API 返回应用程序期望的内容很重要，所以我不应该针对真实服务进行测试，而不是假装它按预期返回吗？如果不是，那么为服务编写测试有什么价值？

【问题讨论】：

真正的 API 返回的内容对于单元测试应该不重要。模拟的原因是将所有超出您控制范围的变量排除在测试之外，这样您就可以专注于验证组件的行为。这就是编写测试的价值。
我也是这么理解的，所以如果我的服务只是做一个 GET 并返回一个 observable，那么测试它有什么价值吗？为 HttpClient 设置所需的时间已经是我认为的 3 倍。
所有的 TestBed 样板，我认为这给我的测试运行带来了问题 - 这似乎不是摆脱 TestBed 的好理由。 TestBed 比孤立测试慢，但它允许测试 DI，

标签： angular unit-testing angular-services

【解决方案1】：

在不使用 TestBed 或其他 Angular 注入器的隔离测试中使用真正的 HttpClient 是不可能的（或至少是不切实际的）。

在隔离测试中，应模拟 HttpClient 以复制真实类，例如：

const httpClientMock = jasmine.createSpyObj('', ['get']);
httpClientMock.get.and.returnValue(Observable.of(['foo']);

const foo = new Foo(httpClientMock);
foo.makeRequest();
expect(httpClientMock.get).toHaveBeenCalledWith('/foo');

【讨论】：