Angular 17.0.6测试报错：ApiService创建失败，缺HttpHandler提供者

错误详情 #

ApiService > should be created
NullInjectorError: R3InjectorError(DynamicTestModule)
[ApiService -> HttpClient -> HttpHandler -> HttpHandler]:
NullInjectorError: No provider for HttpHandler!
error properties: Object({ ngTempTokenPath: null, ngTokenPath:
[ 'ApiService', 'HttpClient', 'HttpHandler', 'HttpHandler' ] })

问题根源 #

测试代码直接将HttpClient添加到providers数组中，但HttpClient依赖HttpHandler才能正常工作，测试环境下没有默认提供这个依赖，因此触发报错。

修正后的测试代码 #

import { TestBed } from '@angular/core/testing';
import { ApiService } from './api.service';
import { EnvServiceProvider } from './env.service.provider';
// 导入测试专用的HttpClient模块
import { HttpClientTestingModule } from '@angular/common/http/testing';

describe('ApiService', () => {
  let service: ApiService;

  beforeEach(() => {
    TestBed.configureTestingModule({
      // 用HttpClientTestingModule替代直接声明HttpClient
      imports: [HttpClientTestingModule],
      providers: [ApiService, EnvServiceProvider]
    });
    service = TestBed.inject(ApiService);
  });

  it('should be created', () => {
    expect(service).toBeTruthy();
  });
});

说明 #

• HttpClientTestingModule是Angular官方为测试场景提供的模块，会自动配置HttpClient所需的全部依赖（包括HttpHandler），同时还附带HttpTestingController工具，方便后续模拟HTTP请求、编写更完整的测试用例。
• 修正后无需再手动将HttpClient加入providers，模块会自动完成依赖注入配置。

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