Angular/NgRx 单元测试无法创建 TestBed

Question

在开发需要 NgRx 存储的组件时，测试套件失败，我收到一条消息，指出...

'无法解析 NavComponent 的所有参数：(?)。'

  ● AppComponent › should create the app

    Can't resolve all parameters for NavComponent: (?).

      at syntaxError (../packages/compiler/src/util.ts:100:17)
      at CompileMetadataResolver._getDependenciesMetadata (../packages/compiler/src/metadata_resolver.ts:957:27)
      at CompileMetadataResolver._getTypeMetadata (../packages/compiler/src/metadata_resolver.ts:836:20)
      at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (../packages/compiler/src/metadata_resolver.ts:377:18)
      at CompileMetadataResolver.loadDirectiveMetadata (../packages/compiler/src/metadata_resolver.ts:224:11)
      at ../packages/compiler/src/jit/compiler.ts:135:36
          at Array.forEach (<anonymous>)
      at ../packages/compiler/src/jit/compiler.ts:133:65
          at Array.forEach (<anonymous>)
      at JitCompiler._loadModules (../packages/compiler/src/jit/compiler.ts:130:71)
      at JitCompiler._compileModuleAndAllComponents (../packages/compiler/src/jit/compiler.ts:115:32)
      at JitCompiler.compileModuleAndAllComponentsAsync (../packages/compiler/src/jit/compiler.ts:69:33)
      at CompilerImpl.compileModuleAndAllComponentsAsync (../packages/platform-browser-dynamic/src/compiler_factory.ts:69:27)
      at TestingCompilerImpl.compileModuleAndAllComponentsAsync (../../packages/platform-browser-dynamic/testing/src/compiler_factory.ts:57:27)
      at TestBedViewEngine.compileComponents (../../packages/core/testing/src/test_bed.ts:362:27)
      at Function.TestBedViewEngine.compileComponents (../../packages/core/testing/src/test_bed.ts:160:66)
      at src/app/app.component.spec.ts:32:8
      at ZoneDelegate.Object.<anonymous>.ZoneDelegate.invoke (node_modules/zone.js/dist/zone.js:391:26)
      at ProxyZoneSpec.Object.<anonymous>.ProxyZoneSpec.onInvoke (node_modules/zone.js/dist/proxy.js:129:39)
      at ZoneDelegate.Object.<anonymous>.ZoneDelegate.invoke (node_modules/zone.js/dist/zone.js:390:52)
      at Zone.Object.<anonymous>.Zone.run (node_modules/zone.js/dist/zone.js:150:43)

我的测试台配置

describe('AppComponent', () => {
  let router: Router;
  let location: Location;
  let store: MockStore<ApplicationState>;
  const initialState: ApplicationState = {
    root: {
      user: null,
      tabs: null
    }
  };

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [RouterTestingModule.withRoutes(routes), MaterialsModule],
      declarations: [AppComponent, NavComponent],
      providers: [provideMockStore({ initialState })]
    }).compileComponents();
    router = TestBed.get(Router);
    location = TestBed.get(Location);
    store = TestBed.get<Store<ApplicationState>>(Store);

    router.initialNavigation();
  });

组件

@Component({
  selector: 'af3-nav',
  templateUrl: './nav.component.html',
  styleUrls: ['./nav.component.css']
})
export class NavComponent implements OnInit {
  tabs$: Observable<NavTab[]>;
  constructor(private store: Store<fromStore.ApplicationState>) {}

  ngOnInit() {
    // this.tabs$ = this.store.pipe(select(fromStore.selectTabsForUserState));
  }
}

我也尝试过导入 StoreModule，但根据 ngrx.io，这不是必需的，因为 provideMockStore() 设置了配置减速器所需的所有提供程序。

错误和堆栈跟踪不是很有帮助。

提前感谢您的帮助。

更新：事实证明，测试台无法注入任何引用的服务。我创建了一个测试服务并尝试运行测试，但在运行测试时收到相同的错误。

更新：NGRX 绝对不是问题。为了添加更多上下文，我一直在尝试追踪这个问题。目前没有提供者可以解决。我用 Jest 替换 Jasmine，看起来 Jest 可能是问题所在。

Answer 1

将emitDecoratorMetadata: true 添加到tsconfig.spec.json 是我的解决方案。

参考：https://github.com/thymikee/jest-preset-angular/issues/288