Как проверить эффекты в ngrx? - PullRequest
Новая
       51

Как проверить эффекты в ngrx?

0 голосов
/ 25 апреля 2018

Я просто хочу получить эффект getUser ниже.

Я использую angular5, typcript и ngrx.

Я открыт для альтернативных примеров тому, что у меня ниже.

Это мой эффект: 

import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/catch';
import { Effect, Actions } from '@ngrx/effects';
import { HttpErrorResponse } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { map, switchMap } from 'rxjs/operators';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';

import * as fromUser from '../actions/user-state.actions';
import { UserService } from '../services/user-state.service';
import { UserStateState } from '../models/user-state.interfaces';

@Injectable()
export class UserStateEffects {

  @Effect({ dispatch: true })
  getUser$: Observable<any> = this.actions$
    .ofType(fromUser.GET_USER)
    .pipe(
      switchMap(() => this.userService.getUser()),
      map((result: any) => new fromUser.UserSuccess(result)))
    .catch((error: HttpErrorResponse) => of(new fromUser.UserFailure(error)));

  constructor(
    private actions$: Actions,
    private userService: UserService
  ) {}
}

Это моя спецификация для теста эффекта: 

import 'rxjs/add/observable/throw';
import { Actions } from '@ngrx/effects';
import { cold, hot } from 'jasmine-marbles';
import { empty } from 'rxjs/observable/empty';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { TestBed } from '@angular/core/testing';

import * as actions from '../actions/user-state.actions';
import { UserService } from '@tradingapplication/user-state/src/state/services/user-state.service';
import { UserStateEffects } from '@tradingapplication/user-state/src/state/effects/user-state.effects';
import { UserStateState } from '../models/user-state.interfaces';
import { UserStateConstants } from '../../user-state.constants';

export class TestActions extends Actions {
  constructor(){
    super(empty());
  }
  set stream(source: Observable<any>){
    this.source = source
  }
}

export function getActions() {
  return new TestActions();
}

fdescribe('UserStateEffects', function () {
  let actions$: TestActions;
  let service: UserService;
  let effects: UserStateEffects;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [ HttpClientTestingModule ],
      providers: [
        UserService,
        UserStateConstants,
        UserStateEffects,
        { provide: Actions, useFactory: getActions },
      ],
    });

    actions$ = TestBed.get(Actions);
    service = TestBed.get(UserService);
    effects = TestBed.get(UserStateEffects);

    spyOn(service, 'getUser').and.returnValue(of(null));
  });

  it('should return user from GetUser', () => {
    const action = actions.GET_USER;
    const completion = new actions.UserSuccess({});

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

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

1 Ответ

0 голосов
/ 30 апреля 2018

Возможно, вы захотите проверить пример приложения NGRX от команды NGRX / Google. Он использует Jasmine-Marbles для тестирования потоков, как в NGRX Effects. Таким образом, вы можете протестировать потоки на предмет их закрытия или нет после выполнения и сколько элементов прошло через них до получения ожидаемого значения. И все это с помощью нескольких штрихов (тиков).

...