如何使用 Apollo 和 Angular 创建单元测试

Question

我正在启动一个 Angular 5 项目，它为我的组件和服务自动生成了一些规范单元测试。对于那些需要 Apollo 的组件，我收到错误 NullInjectorError: No provider for Apollo!

我将 Apollo 模块添加到导入和声明部分，如下所示：

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ ContractsDashboardComponent, Apollo ]
    })
    .compileComponents();
  }));

但是现在我得到了错误

Failed: Unexpected value 'Apollo' declared by the module 'DynamicTestModule'. Please add a @Pipe/@Directive/@Component annotation.

在普通应用程序中，我有一个模块GraphQLModule，它在构造函数中调用apollo.create。我也应该以某种方式嘲笑它吗？

Answer 1

如果 Apollo 是一个模块，那么你应该导入它。

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ Apollo ],
      declarations: [ ContractsDashboardComponent ]
    })
    .compileComponents();
  }));

如果不是模块，应该是提供者，所以需要提供：

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      providers: [ Apollo ],
      declarations: [ ContractsDashboardComponent ]
    })
    .compileComponents();
  }));

因为很明显，它不是一个组件（错误要求它有一个组件装饰器），但是您将其放入声明中。

由于您的第一个错误是 NullInjectorError: No provider for Apollo!，我猜 Apollo 是您注入到组件中的服务，因此您应该使用第二种方法，提供。