R3InjectorError(DynamicTestModule)[Store -> Store]： NullInjectorError： No provider for Store

Question

app.component.ts

...
constructor(private store: Store<fromAppState.AppState>) {}
ngOnInit() {
this.store.dispatch(new fromAppActions.Load());
...

app.state.ts

export interface AppState {
structure: Structure;
buttons: number[];
bars: Bar[];
limit: number;
isLoading: boolean;
error: string;
}
export const initialState: AppState = {
buttons: [],
structure: null,
bars: [],
limit: 0,
isLoading: false,
error: '',
};
const getState = createFeatureSelector<AppState>('myApp');
...

app.component.spec.ts

describe('AppComponent', () => {
const storeMock = jasmine.createSpyObj('Store', ['select']);
let fixture: ComponentFixture<AppComponent>;

beforeEach(async(() => {
fixture = TestBed.createComponent(AppComponent);
storeMock.select.and.returnValue(
of({
structure: structure,
buttons: [45, 23, -8, -12],
bars: [15, 34, 7, 87],
limit: 150,
isLoading: false,
error: '',
})
);
component = fixture.componentInstance;

TestBed.configureTestingModule({
imports: [
RouterTestingModule,
MaterialModule,
StoreModule.forRoot({}, {}),
],
declarations: [AppComponent, FakeLoaderComponent],
providers: [{ provide: Store, useValue: storeMock }],
}).compileComponents();
...
}));
it(`should have as title 'title'`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app.title).toEqual('title');
});
}

app.module.ts

@NgModule({
declarations: [AppComponent, LoaderComponent],

imports: [
BrowserModule,
AppRoutingModule,
BrowserAnimationsModule,
MaterialModule,
HttpClientModule,
StoreModule.forRoot({}, {}),
EffectsModule.forRoot([AppEffects]),
StoreModule.forFeature('myApp', AppReducer),
StoreDevtoolsModule.instrument({
name: 'My DevTools',
maxAge: 50,
logOnly: environment.production,
}),
],
providers: [AppService],
bootstrap: [AppComponent],
})
export class AppModule {}

当我运行ng test时，我得到这个错误：

Failed: R3InjectorError(DynamicTestModule)[Store -> Store]: 
NullInjectorError: No provider for Store!
error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ 'Store', 'Store' ] })
at Jasmine

我是否也需要将减速器导入到规范文件中？

Answer 1

在配置测试台后创建组件。

storeMock.select.and.returnValue(
of({
structure: structure,
buttons: [45, 23, -8, -12],
bars: [15, 34, 7, 87],
limit: 150,
isLoading: false,
error: '',
})
);

TestBed.configureTestingModule({
imports: [
RouterTestingModule,
MaterialModule,
StoreModule.forRoot({}, {}),
],
declarations: [AppComponent, FakeLoaderComponent],
providers: [{ provide: Store, useValue: storeMock }],
}).compileComponents();
// AFTER configuration

fixture = TestBed.createComponent(AppComponent);
component = fixture.componentInstance;