Как исправить неожиданное объявление компонента модулем во время выполнения теста?

Question

Я пытаюсь выполнить модульное тестирование моего углового приложения, которое состоит из двух компонентов.корневой AppComponent и myFormComponent.Я хочу выполнить модульное тестирование в полях формы, доступных в myFormComponent.

Я просмотрел все ответы, приведенные здесь, но, похоже, ни один из них не работает для меня.Приведенные ответы относятся к проблемам во время работы приложения, но моя проблема заключается в том, что я запускаю тест с использованием «npm run test».

// app.module.ts

  import { BrowserModule } from "@angular/platform-browser";
    import { NgModule } from "@angular/core";

    import { AppComponent } from "./app.component";
    import { MyFormComponent } from "./my-form/my-form.component";
    import { FormsModule, ReactiveFormsModule } from "@angular/forms";

    @NgModule({
    declarations: [AppComponent, MyFormComponent],
    imports: [BrowserModule, FormsModule, ReactiveFormsModule],
    providers: [],
    bootstrap: [AppComponent]
    })
    export class AppModule {}

//my-form.component.spec.ts

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

    import { MyFormComponent } from "./my-form.component";
    import { DebugElement } from "@angular/core";
    import { By } from "@angular/platform-browser";
    import { AppComponent } from "../app.component";

    describe("MyFormComponent", () => {
    let component: MyFormComponent;
    let fixture: ComponentFixture<MyFormComponent>;

    let debugElement: DebugElement;
    let htmlElement: HTMLElement;

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

    beforeEach(() => {
    fixture = TestBed.createComponent(MyFormComponent);
    component = fixture.componentInstance;

    fixture.detectChanges();

    // debugElement = fixture.debugElement.query(By.css("p"));
    // htmlElement = debugElement.nativeElement;
    });

    test("check dummy", () => {
    const res = 2 * 3;
    expect(res).toBe(6);
  });
});

На самом деле тест должен пройти, но его не происходит.Я получаю сообщение об ошибке «Неожиданное значение« MyFormComponent », объявленное модулем« DynamicTestModule ». Добавьте аннотацию @ Pipe / @ Directive / @ Component».Когда я удаляю первый метод beforeEach, он, кажется, работает.