Question

我的效果是从参数中获取最新信息，然后将其传递到exhaustMap中，然后调用该服务。

@Effect()
loadPlansOnParams$ = this.actions$.pipe(
 ofType(backlogActions.BacklogActionTypes.GET_BOARDS_IN_PARAMS),
 withLatestFrom(this.store.select(fromRoot.getRouterState), (action, router) => {
   const {
     state: {
       queryParams: { boards },
     },
   } = router;
   return {
     boards,
   };
 }),
 exhaustMap(payload => {
   return this.boardService.getBoardsFromParams(payload.boards).pipe(
     map((res: SignalRResult) => {
       const board = res.item;
       return new backlogActions.GetBoardsSuccess(board);
     }),
     catchError(err => of(new backlogActions.GetBoardsError(err))),
   );
 }),
);

一切是凉爽。但是我不能得到这个测试我的生活。而几乎所有的例子我能找到也没用。

这是我的测试...

describe('getting boards from the params', () => {
    it('should return an empty array if no params', () => {
      const params = { state: { queryParams: {} } };
      const successfulSignalRResult = { isSuccessful: true, item: [] };
      const action = new backlogActions.GetBoardsInParams();
      const outcome = new backlogActions.GetAvailableBoardsSuccess([]);
      actions.stream = hot('-a', { a: action });
      store.select = jest.fn(() => of(params));
      expected = cold('--b', { b: outcome });
      boardSvc.getBoardsFromParams = jest.fn(() => successfulSignalRResult);
      expect(effects.loadPlansOnParams$).toBeObservable({});
    });
  });

无论我对商店做什么。选择模拟我都会得到“您在期望流的位置提供了'undefined'。”

感谢您的帮助。我真的希望我的思念在大理石上的东西。

Answer 1

也许这是最新答案。我遇到了同样的问题。

我不知道确切原因。在我看来，当同时使用MockStore和effect时，不会初始化getRouterState。在构造函数中初始化loadPlansOnParams $时，没有正确初始化getRouterState。

简单来说，像这样的getRouterState初始化位于loadPlansOnParams $之前。

@Effect()

SomeVariableForGetRouterState:Observable<SomeThing> = ..... fromRoot.getRouterState ..... like this.. 

loadPlansOnParams$ = this.actions$.pipe(
ofType(backlogActions.BacklogActionTypes.GET_BOARDS_IN_PARAMS),
withLatestFrom( SomeVariableForGetRouterState, (action, router) => {
.....
);

Answer 2

这有点晚了，但我遇到了类似的问题。我相信您必须使用正确的路由器数据初始化商店。非常感谢this excellent youtube video by @brian_love和他的github repo

注意事项：

我正在使用 provideMockStore 和 provideMockActions
我正在初始化 TestBed 并提供我的模拟实现

这是我的工作示例：

import { cold, hot } from 'jasmine-marbles'
import { provideMockActions } from '@ngrx/effects/testing';
import { MockStore, provideMockStore } from '@ngrx/store/testing';
import { TestBed } from '@angular/core/testing';

import * as fromStore from '.';
import { ApplicationDocument } from 'shared-libs';
import { Actions } from '@ngrx/effects';
import { ApplicationDocumentService } from '../application-document.service';
import { ApplicationDocumentEffects } from './application-document.effects';

describe('ApplicationDocument Store', () => {

  let applicationDocument: ApplicationDocument
  let error: any
  let actions$: Actions
  let service: ApplicationDocumentService
  let effects: ApplicationDocumentEffects
  let store: any
  
  describe('effects', () => {
  // Note: Must initialize store with router state
    const initialState = {
      router: {
        state: { params: { applicationId: 1 } }
      }
    }
    
    beforeEach(async () => {
      TestBed.configureTestingModule({
        providers: [
          ApplicationDocumentEffects,
          provideMockStore({ initialState }), //<-- must provide the initialState to the mockStore
          provideMockActions(() => actions$),
          {
            provide: ApplicationDocumentService,
            useValue: {
              getDocuments: jest.fn()
            }
          }
        ]
      })

      effects = TestBed.inject(ApplicationDocumentEffects)
      service = TestBed.inject(ApplicationDocumentService)
      store = TestBed.inject(MockStore)
    })
    
    
    it('should be created', () => {
      expect(effects).toBeTruthy();
    });
    
    describe('loadDocuments', () => {

      it('should return loadApplicationDocumentsSuccess action, with the documents', () => {
        applicationDocument = {documentId: 1};

        const action = fromStore.loadApplicationDocuments();
        const outcome = fromStore.loadApplicationDocumentsSuccess({ 
          applicationDocuments: [applicationDocument] 
        })
        actions$ = hot('-a', { a: action })

        const response = cold('-a|', { a: [applicationDocument] })
        const expected = cold('--b', { b: outcome })
        service.getDocuments = jest.fn(() => response)

        expect(effects.loadApplicationDocuments$).toBeObservable(expected)
      })
    })

  })
  
  });

如何NGRX效果的单元测试withLatestFrom

2 个答案: