Angular 测试访问其他组件

如何解决Angular 测试访问其他组件

我正在尝试设置我的角度测试，但该测试试图在我尝试测试的组件之外加载一个组件：

组件是一个简单的语言选择器：

language.component.ts：

import { Component,OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';

@Component({
  selector: 'app-language',templateUrl: './language.component.html',styleUrls: ['./language.component.scss'],})
export class LanguageComponent implements OnInit {
  current: string;
  langs: string[];

  constructor(public translate: TranslateService) {}

  ngOnInit(): void {
    this.langs = this.translate.getLangs();
    this.current = this.translate.currentLang;
  }

  setLang(lang: string) {
    this.translate.use(lang);
    this.current = lang;
    localStorage.setItem('translation.language',lang);
  }
}

language.component.spec.ts：

import { ComponentFixture,Testbed } from '@angular/core/testing';
import { MatMenuModule } from '@angular/material/menu';
import { TranslateModule } from '@ngx-translate/core';
import { LanguageComponent } from './language.component';

fdescribe('LanguageComponent',() => {
  let component: LanguageComponent;
  let fixture: ComponentFixture<LanguageComponent>;

  beforeEach(() => {
    Testbed.configureTestingModule({
      declarations: [LanguageComponent],imports: [TranslateModule.forRoot(),MatMenuModule],}).compileComponents();
  });

  beforeEach(() => {
    fixture = Testbed.createComponent(LanguageComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

  afterEach(() => {
    fixture.destroy();
  });
});

language.component.html：

<button mat-icon-button [matMenuTriggerFor]="Lang">{{ this.current }}</button>
<mat-menu #Lang="matMenu">
  <button
    mat-menu-item
    *ngFor="let lang of langs"
    [value]="lang"
    (click)="setLang(lang)"
  >
    {{ 'languages.' + lang | translate }}
  </button>
</mat-menu>

如您所见，我使用的是 fdescribe，因此它仅测试该特定组件。但是会抛出以下错误：

  An error was thrown in afterall
  Uncaught ReferenceError: Cannot access 'ShellComponent' before initialization
  ReferenceError: Cannot access 'ShellComponent' before initialization
      at Module.ShellComponent (http://localhost:9876/_karma_webpack_/main.js:39178:113)
      at Module.ShellComponent (http://localhost:9876/_karma_webpack_/main.js:27719:172)
      at Module.ShellComponent (http://localhost:9876/_karma_webpack_/main.js:37580:162)
      at Module.i2L+ (http://localhost:9876/_karma_webpack_/src/app/_shared/shared.module.ts:36:5)
      at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:84:1)
      at Module.LEUy (http://localhost:9876/_karma_webpack_/main.js:17430:72)
      at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:84:1)
      at Module.oPWF (http://localhost:9876/_karma_webpack_/main.js:34920:68)
      at __webpack_require__ (http://localhost:9876/_karma_webpack_/webpack/bootstrap:84:1)
      at Module.05o4 (http://localhost:9876/_karma_webpack_/main.js:1768:72)

ShellComponent 是导入 LanguageComponent 的那个，但我不知道它为什么要尝试访问它以进行此测试。

Google 说要将 emitDecoratorMetadata 设为 false，但这没有任何改变。除此之外，我还没有找到任何解决此问题的方法

问候