CODEWITHSUNDEEP
angularngrxngrx-effectsredux-devtools
sravan ganji
sravan ganji

Reputation: 5125

how to debug ngrx effects?

i am using tap operator in multiple places in the effect. but some how i am not seeing the console logs in the browser.

here is my effect.

  getAccountDetails$ = createEffect(() => {
    return this.actions$.pipe(
      ofType(getAccountDetails),
      tap((action) => console.log(`Received ${action.type}`)),
      withLatestFrom(this.store.select(selectAccounts)),
      tap((accs) => console.log(`Received ${accs}`, accs)),
      mergeMap((accounts) => {
        console.log('acconts from accounts details : ', accounts);
        return this.accountService.getAccounts$().pipe(
          map((accounts) => {
            console.log(accounts);
            return getAccountsSuccess({ payload: accounts });
          }),
          catchError((error) => {
            return of(getAccountsError({ errorMessage: error.message }));
          })
        );
      })
    );
  });

i am dispatching my action from the component ngOninit.

ngOnInit(): void {
    this.store.dispatch(getAccounts());
    this.store.dispatch(getAccountDetails());
  }

when i verify the actions being called in the browser redux devtools , i can see the correct flow. enter image description here

Q: wondering why my console.log is not printing, is there any better way to debug the effects ?

Upvotes: 0

Views: 1208

Answers (1)

timdeschryver
timdeschryver

Reputation: 15505

You probably need to register the effect with EffectsModule.forRoot([YourEffectClass]) or EffectsModule.forFeature([YourEffectClass])

https://ngrx.io/guide/effects#registering-root-effects

Upvotes: 0

Related Questions