如何在 ngrx 中测试效果?

角M

我只想在下面获得我的 getUser 效果。

我正在使用 angular5、typescript 和 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);
  });
});
菲尔

您可能想查看NGRX/Google 团队NGRX 示例应用程序它利用 Jasmine-Marbles 来测试流,如 NGRX 效果中使用的那样。通过这种方式,您可以测试流在执行后是否关闭以及在预期值到达之前有多少元素通过它们。所有这一切只需要几个破折号(勾号)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在angular Ngrx中的效果中传递ID

来自分类Dev

如何在ngrx效果的switchMap中引发Error

来自分类Dev

如何在@ ngrx / data中对EntityCollectionServiceBase进行单元测试?

来自分类常见问题

如何在NgRx中推送或更新状态?

来自分类Dev

如何在ngrx / router中启用routerCanDeactivate?

来自分类Dev

如何在 NGRX 中创建 EntityState 的集合

来自分类Dev

使用延迟测试 NGRX 效果

来自分类Dev

如何从NgRx中的单个效果分派多个动作?

来自分类Dev

如何在ngrx / store测试中为特定选择器返回假/存根值?

来自分类Dev

如何测试NgRX中是否调度了动作?

来自分类Dev

如何在量角器中定位 Ngrx/Store

来自分类Dev

如何在 ngrx 效果中使用 ngrx 存储?我需要来自商店的数据来进行 api 调用

来自分类Dev

如何对 Ngrx 的这种实现进行测试?

来自分类Dev

如何有条件地从ngrx中的效果分派多个动作

来自分类Dev

用笑话测试NGRX /效果-测试始终通过

来自分类Dev

NgRx-选择效果中的AppState

来自分类Dev

在NGRX中以什么顺序执行效果

来自分类Dev

如何使用ngrx / effects执行多个相关的操作/效果/动作

来自分类Dev

NgRx效果mergeMap方法

来自分类Dev

ngrx从效果更新状态

来自分类Dev

如何在路由参数更改时测试ngrx存储操作调度?

来自分类Dev

如何检测组件中的NGRX状态事件?

来自分类Dev

测试失败动作-大理石-NGRX效果

来自分类Dev

如何使用NgRx-Effects中的LatestFrom商店注射测试多个?

来自分类Dev

ngrx action:如何测试该动作是否已调度

来自分类Dev

如何在@ ngrx / data中扩展自定义实体集合精简器

来自分类Dev

如何在 ngrx 中注入初始状态

来自分类Dev

Ngrx效果并行http调用

来自分类Dev

ngrx:商店INIT操作的效果

Related 相关文章

热门标签

归档