为什么在使用ngrx的延迟加载的Angular 6应用程序的单元测试中，出现“ ReducerManager没有提供者！”错误？

Question

I have a lazy loading Angular 6 app that uses ngrx . I have an:

app.module.ts
shared.module.ts
core.module.ts

The core module has things like the footer and header. There are no store/ngrx related stuff here, but the unit tests for the header (that were working before implementing ngrx) keep failing with the following error:

StaticInjectorError(Platform: core)[StoreFeatureModule -> ReducerManager]: NullInjectorError: No provider for ReducerManager!

The only thing I can think of is that the StoreModule is not imported into the CoreModule . But should it? Why are the tests failing when the header has nothing to do with state?

app.module.ts

@NgModule({
declarations: [
    AppComponent,
    LoginComponent,
],
imports: [
    BrowserModule,
    AppRoutingModule,
    CoreModule,
    SharedModule.forRoot(),
    StoreModule.forRoot({}),
    EffectsModule.forRoot([]),
    !environment.production ? StoreDevtoolsModule.instrument({
        maxAge: 5   // retains last 5 states
    }) : []
],
providers: [],
bootstrap: [ AppComponent ]

})

core.module.ts

@NgModule({
    imports: [
        CommonModule,
    ],
    exports: [
        CommonModule,
        HeaderComponent,
        FooterComponent
    ],
    declarations: [
        HeaderComponent, 
        FooterComponent, 
    ]
})

shared.module.ts

@NgModule({
    imports: [
        CommonModule,
        HttpClientModule
    ],
    exports: [
        CommonModule,
        MyComponent
    ],
    declarations: [ MyComponent]
})
export class SharedModule {

** header.component.spec.ts**

describe('HeaderComponent', () => {
    let component: HeaderComponent;
    let fixture: ComponentFixture<HeaderComponent>;
    let debugEl: DebugElement;

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            imports: [ 
                ProductsModule,
                CustomersModule
        ],
        declarations: [ HeaderComponent ],
        providers: [
            { provide: myService, useValue: new MyService() },
        ],
    })
    .compileComponents();
}));

beforeEach(() => {
    fixture = TestBed.createComponent(HeaderComponent);
    component = fixture.componentInstance;
    debugEl = fixture.debugElement;
    fixture.detectChanges();
});

Answer 1

因为您的组件使用NgRx存储，所以您还必须将存储导入到TestBed 。

Answer 2

import { Store, StoreModule } from '@ngrx/store';

describe('test:', () => {
   beforeEach(() => {
   TestBed.configureTestingModule({
   imports: [
    HeldMessagesTabsPageModule,
    StoreModule.forRoot(
      {
        messagesRoot: combineReducers(reducers.reducers)
      },
      {
        initialState: { messagesRoot: { messagesRoot: { template: templateInitialState } } }
      }
    )
  ],

  const store: Store<reducers.State>;
}

beforeEach(() => {
  store = TestBed.get(Store);
  spyOn(store, 'dispatch').and.callThrough();
});