Unit testing Ngrx select angular

Question

I have something like this

  ngOnInit(): void {
    this.store.select('loggedUser').pipe(take(1))
      .subscribe(user => {
        this.loggedUser = user;
      });
  }

  it('should init well', () => {
    // GIVEN
    const store = spyOn(component.store, 'select').and.callThrough();
    // WHEN
    component.ngOnInit();
    // THEN
    expect(store).toHaveBeenCalledTimes(1);
    expect(component.loggedUser).toBe(initialState.loggedUser);
  });

Sorry I dont have some example, but I dont know how even to start unit test this, thanks

Answer 1

Define your selector explicitly using createSelector (You probably want to use a feature slice as below - see https://ngrx.io/guide/store/selectors):

export interface AppState {
  user: UserState;
};

export interface UserState {
  loggedUser: string;
}

const selectUserState = (state: AppState) => state.user;
export const selectLoggedUser = createSelector(selectUserState, user => user.loggedUser);

Now test only the selector, independently of your component:

it('loggedUser returns expected user', () => {
  const state = { 
    user: { loggedUser: 'Test User' }
  };
  expect(selectLoggedUser(state)).toBe('Test User');
});