Angular Karma Jasmine Error: Illegal state: Could not load the summary for directive

You passed HeroDetailComponent to TestBed.createComponent() without declaring the component first:

TestBed.configureTestingModule({
  imports: [AppModule,
     CommonModule,
     FormsModule,
     SharedModule,
     HeroRoutingModule,
     ReactiveFormsModule
  ],
  providers: [
    {provide: APP_BASE_HREF, useValue: "https://stackoverflow.com/"}
  ],
  declarations: [HeroDetailComponent]
}).compileComponents();

Hope it helps.

Update for following errors in your test: Added some more imports (just take your HeroModule as a blueprint because that’s basically what you want to import and provide).