No provider for MockStore

Question

I am trying to test my app.component using cypress. The component receives data from ngrx store. I've followed the official docs to setup the test. This is the test setup:

let store: MockStore;
let initialState: { loggedOnUser: null };

beforeEach(() => {
    cy.mount(AppComponent, setupCypressConfig<AppComponent>({
        providers: [
            provideMockStore({ initialState }),
        ]
    }));
    store = TestBed.inject(MockStore);
});

I am receiving the following error:

NullInjectorError: No provider for MockStore!

It's weird becuase I have this setup in the exact same way in another component and it works fine. I'm using standalone components by the way.

I've tried the solutions provided in other SO posts to no avail. Other things I have tried:

• Injecting Store instead of MockStore. Like this: store = TestBed.inject(Store);

• Providing the actual MockStore to the providers like this:

  cy.mount(AppComponent, setupCypressConfig<AppComponent>({
     providers: [
        MockStore,
        provideMockStore({ initialState }),
     ]
  }));
  

Answer 1

This has been resolved by replacing store = TestBed.Inject(MockStore) with store = createMockStore({ initialState });.

let store: MockStore;
let initialState: { loggedOnUser: null };

beforeEach(() => {
    cy.mount(AppComponent, setupCypressConfig<AppComponent>({
        providers: [
            provideMockStore({ initialState }),
        ]
    }));
    store = createMockStore({ initialState });
});