angular - 初始化前无法访问 'NgbNavLink'

Question

我尝试使用 Jest 在 Angular 13 中测试包含 ng-bootstrap 组件的组件，并收到以下错误: 初始化前无法访问“NgbNavLink”。

我有一个组件MyComponent，它使用NgbModal。我只想为此组件创建测试，因此我需要在测试中导入 NgbModule 。但是，导入似乎不起作用，因为我收到以下错误:

 FAIL  src/app/pages/kafkaconnect/kafkaconnect.component.spec.ts
  ● Test suite failed to run

    ReferenceError: Cannot access 'NgbNavLink' before initialization

      2 |
      3 | import { MyComponent } from './mycomponent.component';
    > 4 | import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
        | ^

      at Object.<anonymous> (node_modules/@ng-bootstrap/ng-bootstrap/fesm2015/ng-bootstrap.mjs:6651:991)
      at Object.<anonymous> (src/app/pages/kafkaconnect/kafkaconnect.component.spec.ts:4:1)

这是我的测试类:

import { ComponentFixture, TestBed } from '@angular/core/testing';

import { MyComponent } from './mycomponent.component';
import { NgbModule } from "@ng-bootstrap/ng-bootstrap";

describe('MyComponent', () => {
  let component: MyComponent;
  let fixture: ComponentFixture<MyComponent>;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [ MyComponent ],
      imports: [ NgbModule ],
    })
    .compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(MyComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

我正在使用 Angular 13、ng-bootstrap 11.0.0-rc.0 和 bootstrap 4.6.1。我知道这些版本是最新版本，但我在服务或构建我的应用程序时没有遇到任何错误。

Angular CLI: 13.0.3
Node: 16.13.0
Package Manager: npm 8.1.0
OS: win32 x64

Angular: 13.0.2
... animations, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1300.3
@angular-devkit/build-angular   13.0.3
@angular-devkit/core            13.0.3
@angular-devkit/schematics      13.0.3
@angular/cli                    13.0.3
@schematics/angular             13.0.3
rxjs                            6.6.7
typescript                      4.4.4

最后，我使用的是jest 27.3.1。由于我使用 Angular，我已按照 this documentation 配置 jest-preset-angular .

有什么线索可以解释为什么我会收到此错误吗？

Answer 1

问题似乎出在 ng-bootstrap 11.0.0-rc.0 上。升级到 ng-bootstrap 12.0.0-beta.4 解决了该问题。