升级Angular12后测试报NullInjectorError无HttpHandler提供者如何解决

• 优先使用测试专用的HttpClientTestingModule替代业务代码用的HttpClientModule
  测试环境下不要导入普通的HttpClientModule，换成@angular/common/http/testing包下的HttpClientTestingModule，该模块已经内置了HttpHandler等依赖的mock实现，专门用于单元测试场景。
  基础配置示例如下：

  import { HttpClientTestingModule } from '@angular/common/http/testing';
  import { TestBed } from '@angular/core/testing';
  // 导入你要测试的组件/服务
  
  beforeEach(async () => {
    await TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      // 补充你的declarations、providers配置
    }).compileComponents();
  });
  

• 排查SSR相关依赖的缺失
  因为项目启用了服务端渲染，部分服务可能依赖SSR相关的注入Token（比如REQUEST、RESPONSE、TransferState等），如果这些Token没有在测试模块中提供mock值，可能会间接导致依赖注入链断裂，触发HttpHandler相关报错。你需要在测试的providers数组中添加对应Token的mock实现，例如：

  providers: [
    { provide: TransferState, useValue: {} },
    // 其他SSR相关Token的mock配置
  ]
  

• 检查依赖模块的导入完整性
  如果你测试的组件/服务依赖某个共享模块，而该共享模块内部用到了HttpClient相关能力，你需要在测试模块中完整导入该共享模块，不能只导入HttpClientTestingModule。
• 排查测试配置覆盖问题
  检查是否存在多个TestBed.configureTestingModule调用，后执行的配置覆盖了之前导入的HttpClientTestingModule，或者imports数组中存在拼写错误、路径错误导致模块未正确导入。

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