Тестирование эффектов NGRX с {dispatch: false} - PullRequest
Новая
       9

Тестирование эффектов NGRX с {dispatch: false}

0 голосов
/ 18 ноября 2018

Я пытался заставить это работать часами. Это первый проект, который я перевел в Jest вместо Karma, и пока все хорошо. Я решил написать несколько тестов для своих эффектов, и по какой-то причине я совершенно не в состоянии протестировать их так, как я ожидал.

Эффект, который я пытаюсь проверить, довольно прост: 

@Effect({ dispatch: false })
go$ = this.actions$.pipe(
  ofType(RouterActions.GO),
  tap(
    ({ payload: { path, query: queryParams, extras } }: RouterActions.Go) => {
      this.router.navigate(path, { queryParams, ...extras });
    }
  )
);

Я ввел фальшивый маршрутизатор и собирался проверить, что он вызывал навигацию, этот тест прошел много итераций, пытаясь заставить его работать, но у меня сейчас есть: 

describe('Router Effects', () => {
  let actions$: Observable<any>;
  let router: TestRouter;
  let effects: RouterEffects;
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [
        RouterEffects,
        provideMockActions(() => actions$),
        {
          provide: Router,
          useFactory: getRouter
        }
      ]
    });

    actions$ = TestBed.get(Actions);
    router = TestBed.get(Router);
    effects = TestBed.get(RouterEffects);
  });

  describe('go$', () => {
    test('should call router.navigate with the correct path', done => {
      const action = new fromActions.Go({ path: ['some', 'path'] });

      actions$ = hot('-a', { a: action });
      const expected = cold('-b', { b: action });

      effects.go$.subscribe(
        result => {
          console.log('inside subscribe?');
          expect(router.navigate).toHaveBeenCalled();
          console.log('after expect');
          done();
          console.log('after done?');
        },
        done,
        done
      );

      expect(effects.go$).toBeObservable(expected);
    });
  });
});

Когда я запускаю этот тест, я получаю следующие результаты в моем терминале: 

FAIL  src/app/store/effects/router.effects.spec.ts (5.832s)
  ● Console

    console.log src/app/store/effects/router.effects.spec.ts:48
      inside subscribe?
    console.log src/app/store/effects/router.effects.spec.ts:50
      after expect
    console.log src/app/store/effects/router.effects.spec.ts:52
      after done?

  ● Router Effects › go$ › should call router.navigate with the correct path

    Timeout - Async callback was not invoked within the 5000ms timeout specified by jest.setTimeout.

Я вырывал свои волосы, пытаясь понять, почему этот асинхронный обратный вызов не вызывается? Я воспроизвел минимальное репо здесь: https://github.com/BenAychh/example-ngrx-effects-jest, и рассматриваемый код находится в этой папке https://github.com/BenAychh/example-ngrx-effects-jest/tree/master/src/app/store/effects. Если кто-то заинтересован в том, чтобы помочь мне в этом, вы сможете клонировать весь этот репо. и просто запусти его и (надеюсь) посмотри, что я вижу.

1 Ответ

0 голосов
/ 28 января 2019

Учитывая этот эффект: 

@Injectable()
export class AuthEffects {
    @Effect({ dispatch: false })
    public logoutSuccess$ = this.actions$.pipe(
        ofType(AuthActionTypes.LogoutSuccess),
        tap(() => this.localStorage.removeItem(AUTH_FEATURE_KEY)),
        tap(() => this.router.navigate(['/']))
    );
}

Это способ, которым я работаю, чтобы проверить dispatch: false эффект: 

describe('logoutSuccess$', () => {
    it('should navigate and remove related data from local storage', () => {
        const action = new LogoutSuccess;
        actions$ = cold('-a', { a: action });

        expect(effects.logoutSuccess$).toBeObservable(actions$);
        expect(localStorageService.removeItem).toHaveBeenCalledWith(AUTH_FEATURE_KEY);
        expect(router.navigate).toHaveBeenCalledWith(['/']);
    });
});

.toBeObservable(actions$) делает свое дело.

На основании этого ответа .

...