为什么 Jasmine 会抛出很多错误:Cannot configure the test module when the test module has already been instantiated?

Why Jasmine throws me many errors: Cannot configure the test module when the test module has already been instantiated?

我很困惑。我在学习 Angular 并且正在为我的服务 类 编写单元测试,完全没有问题。今天我准备了我的第一个组件规范文件,Jasmine 变得疯狂了。使用此代码时:

beforeEach(() => {
  TestBed.configureTestingModule({
    declarations: [FooterComponent],
  });
  fixture = TestBed.createComponent(FooterComponent);
  component = fixture.componentInstance;
  span = fixture.nativeElement.querySelector('span');
});

Jasmine 在我的 146 次测试中有 31 次抛出错误:

Error: Cannot configure the test module when the test module has already been instantiated. Make sure you are not using inject before R3TestBed.configureTestingModule.

而且所有的错误都在服务文件的测试中,没有一个是组件测试的。我猜它可能与创建 fixturecomponent 的实例有某种关系。但我不知道如何。当我评论所有夹具行时,如下所示,没有一个错误:

beforeEach(() => {
  TestBed.configureTestingModule({
    declarations: [FooterComponent],
  });
  // fixture = TestBed.createComponent(FooterComponent);
  // component = fixture.componentInstance;
  // span = fixture.nativeElement.querySelector('span');
});

我已经试过了,没有效果:

此外,我无法在 SO 问题中处理类似的情况。这是我的服务测试文件的示例:

beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      providers: [
        {
          provide: HTTP_INTERCEPTORS,
          useClass: JwtInterceptor,
          multi: true,
        },
        { provide: AuthService, useValue: authMock },
      ],
    });

    injector = getTestBed();
    httpMock = injector.inject(HttpTestingController);
  });

  afterEach(() => {
    httpMock.verify();
  });

完整错误示例:

Error: Cannot configure the test module when the test module has already been instantiated. Make sure you are not using inject before R3TestBed.configureTestingModule. at TestBedRender3.assertNotInstantiated (http://localhost:9876/karma_webpack/node_modules/@angular/core/ivy_ngcc/fesm2015/testing.js:2026:1) at TestBedRender3.configureTestingModule (http://localhost:9876/karma_webpack/node_modules/@angular/core/ivy_ngcc/fesm2015/testing.js:1932:1) at Function.configureTestingModule (http://localhost:9876/karma_webpack/node_modules/@angular/core/ivy_ngcc/fesm2015/testing.js:1822:1) at UserContext. (http://localhost:9876/karma_webpack/src/app/app-core/_helpers/jwt.interceptor.spec.ts:26:13) at ZoneDelegate.invoke (http://localhost:9876/karma_webpack/node_modules/zone.js/dist/zone-evergreen.js:364:1) at ProxyZoneSpec.push.QpwO.ProxyZoneSpec.onInvoke (http://localhost:9876/karma_webpack/node_modules/zone.js/dist/zone-testing.js:292:1) at ZoneDelegate.invoke (http://localhost:9876/karma_webpack/node_modules/zone.js/dist/zone-evergreen.js:363:1) at Zone.run (http://localhost:9876/karma_webpack/node_modules/zone.js/dist/zone-evergreen.js:123:1) at runInTestZone (http://localhost:9876/karma_webpack/node_modules/zone.js/dist/zone-testing.js:545:1) at UserContext. (http://localhost:9876/karma_webpack/node_modules/zone.js/dist/zone-testing.js:560:1)

这个问题很愚蠢。它丢失了 describecompileComponents:

describe('FooterComponent', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [FooterComponent],
    }).compileComponents();

    fixture = TestBed.createComponent(FooterComponent);
    component = fixture.componentInstance;
    span = fixture.nativeElement.querySelector('span');
  });
});