如何用茉莉花测试ngrx/效果/用Angular5、ngrx5测试业力?

如何用茉莉花测试ngrx/效果/用Angular5、ngrx5测试业力?,angular,unit-testing,typescript,ngrx,ngrx-effects,Angular,Unit Testing,Typescript,Ngrx,Ngrx Effects,这是我需要测试的文件。 我正在使用Angular5(^5.2.0)、ngrx5(^5.2.0),目前我的注意力集中在一些特效服务上。 这是我当前需要测试的代码。 但我不知道如何正确地实现它,我做了一些尝试,但都失败了。你们有零碎的小费吗?谢谢 import { Injectable } from '@angular/core'; import { Actions, Effect } from '@ngrx/effects'; import { FETCH_DATA } from '../redu

这是我需要测试的文件。 我正在使用Angular5(^5.2.0)、ngrx5(^5.2.0),目前我的注意力集中在一些特效服务上。 这是我当前需要测试的代码。 但我不知道如何正确地实现它,我做了一些尝试,但都失败了。你们有零碎的小费吗?谢谢

import { Injectable } from '@angular/core';
import { Actions, Effect } from '@ngrx/effects';
import { FETCH_DATA } from '../reducers/data.reducer';
import { DataService } from './data.service';
import { Subject } from 'rxjs/Subject';
import { ActionWithPayload } from '../types/app-actions';

@Injectable()
export class AutoCompleteEffects {
  public autoComplete$ = new Subject<{
    type: string;
    payload: { results: string[]; searchValue: string };
  }>();

  @Effect()
  getData$ = this.actions$.ofType(FETCH_DATA).switchMap((action: ActionWithPayload) => {
    return this.data
      .getData(action.payload)
      .map(results => ({
    type: 'FETCHED_DATA',
    payload: { results, searchValue: action.payload }
      }))
      .catch(() =>
    Observable.of({
      type: 'FETCHED_DATA',
      payload: { results: [], searchValue: action.payload }
    })
      );
  });


  constructor(
    private actions$: Actions,
    private data: DataService,
  ) {
    this.getData$.subscribe(action => this.autoComplete$.next(action));
  }

  public getAutoCompleteEffects() {
    return this.autoComplete$.asObservable();
  }
}
从'@angular/core'导入{Injectable};
从'@ngrx/effects'导入{Actions,Effect};
从“../reducers/DATA.reducer”导入{FETCH_DATA};
从“./data.service”导入{DataService};
从'rxjs/Subject'导入{Subject};
从“../types/app actions”导入{ActionWithPayload};
@可注射()
导出类自动完成效果{
公共自动完成$=新主题();
@效果()
getData$=this.actions$.of type(FETCH_DATA).switchMap((action:ActionWithPayload)=>{
返回此.data
.getData(action.payload)
.map(结果=>({
类型:“获取的_数据”,
有效负载:{results,searchValue:action.payload}
}))
.catch(()=>
可观察的({
类型:“获取的_数据”,
有效负载:{results:[],searchValue:action.payload}
})
);
});
建造师(
私有操作$:操作,
私有数据:数据服务,
) {
this.getData$.subscribe(action=>this.autoComplete$.next(action));
}
公共getAutoCompleteTeffects(){
返回此.autoComplete$.asObservable();
}
}

您需要有几样东西

  • 使用provideMockActions遵循ngrx效果测试设置(请参阅)
  • 模拟数据服务并注入它
  • 之后,这只是一个不同动作的测试

    it('should suggest auto complete values', () => {
      actions = of([<test-actions>]);
      const expectedEffects = of([<expected-actions-from-effects>]);
    
      expect(TestBed.get(AutoCompleteEffects).getData$).toBeObservable(expectedEffects);
    });
    
    it('应该建议自动完成值',()=>{
    动作=of([]);
    const expectedEffects=of([]);
    expect(TestBed.get(AutoCompleteEffects.getData$).tobeobbservable(expectedefects);
    });