Операторы конвейерной передачи NGXS

Действия в NGXS обрабатываются с помощью Observables. NGXS предоставляет вам конвейерные операторы, для вашего теста вы можете использовать ofActionDispatched. Вот список, который я взял из документации NGXS:

• ofAction срабатывает, когда происходит любое из перечисленных ниже событий жизненного цикла.
• ofActionDispatched срабатывает при отправке действия
• ofActionSuccessful срабатывает при успешном завершении действия
• ofActionCanceled срабатывает, когда действие было отменено
• ofActionErrored срабатывает, когда действие вызвало ошибку
• ofActionCompleted срабатывает, когда действие было завершено, независимо от того, было оно успешным или нет (возвращает сводку о завершении)

Отвечать

1. Создать переменную actions$

describe('control-center.state', () => {
  let actions$: Observable<any>;

  // ...
});

2. Инициализировать переменную actions$ наблюдаемым

beforeEach(() => {
  TestBed.configureTestingModule({
    imports: [
      NgxsModule.forRoot([AppState]),
      NgxsModule.forFeature([ControlCenterState])
    ]
  });
  store = TestBed.get(Store);
  actions$ = TestBed.get(Actions);
})

3.1 Проверьте, было ли вызвано 1 действие:

Отфильтруйте свои действия из потока с помощью оператора ofActionsDispatched().

it('should dispatch LogoutAction', (done) => {
  actions$.pipe(ofActionDispatched(LogoutAction)).subscribe((_) => {
    done();
  });

  service.logout();
});

3.2 Проверьте, было ли вызвано несколько действий:

Используйте оператор zip RXJS, чтобы объединить два наблюдаемых объекта с функцией ofActionsDispatched() (zip: после того, как все наблюдаемые объекты испускают, испускают значения в виде массива).

it('should dispatch ResetStateAction and LogoutAction', (done) => {
  zip(
    actions$.pipe(ofActionDispatched(ResetStateAction)),
    actions$.pipe(ofActionDispatched(LogoutAction))
  ).subscribe((_) => {
    done();
  });

  service.logout();
});

Спецификация не будет завершена, пока не будет вызвана ее done. Если done не вызывается, будет сгенерировано исключение тайм-аута.

Из документации Jasmine.

Я попробовал этот подход, чтобы проверить, были ли вызваны оба действия:

3. Проверьте, вызываются ли действия

// ...
it('should call actions ResetStateAction and LogoutAction', async( () => {
  let actionDispatched = false;
  zip(
    actions$.pipe(ofActionDispatched(ResetStateAction)),
    actions$.pipe(ofActionDispatched(LogoutAction))
  )
  .subscribe( () => actionDispatched = true );

  store.dispatch([new ResetStateAction(), new LogoutAction()])
    .subscribe(
      () => expect(actionDispatched).toBe(true)
    );
}));
// ...

Использование Jasmine Spies

Я считаю, что при модульном тестировании необходимо высмеивать фактическую реализацию всех связанных зависимостей, и, следовательно, мы не должны включать сюда какие-либо фактические хранилища. Здесь мы предоставляем jasmine spy для Store и просто проверяем, отправляются ли определенные действия с правильными параметрами. Это также может быть использовано для предоставления данных-заглушек.

describe('LogoutService', () => {
  let storeSpy: jasmine.SpyObj<Store>;

  beforeEach(() => {
    storeSpy = jasmine.createSpyObj(['dispatch']);

    TestBed.configureTestingModule({
      providers: [LogoutService, { provide: Store, useValue: storeSpy }]
    });
  })

  it('should dispatch Logout and Reset actions', () => {
    storeSpy.dispatch.withArgs([
      jasmine.any(ResetStateAction), 
      jasmine.any(LogoutAction)])
     .and
     .callFake(([resetAction, logoutAction]) => {
       expect(resetAction.payload).toEqual({...something});
       expect(logoutAction.payload).toEqual({...somethingElse});
    });

    TestBed.inject(LogoutService).logout();
});