0

我正在使用 xstate 来实现登录流程。我有一台机器，initialState 调用 Promise，如果它被拒绝，它将重定向到具有entry操作的状态。我想测试是否在正确的时间正确调用了该操作。

机器.ts

{
  id: 'entrance',
  initial: States.FETCHING_SESSION,
  states: {
    [States.FETCHING_SESSION]: {
      invoke: {
        src: 'fetchSession',
        onError: {
          target: States.LOGGED_OUT,
        }
      }
    },
    [States.LOGGED_OUT]: {
      entry: ['navigateToLogin']
      type: 'final'
    },
  }
}

machine.spec.ts

    const mockFetchSession = jest.fn()
      .mockRejectedValueOnce({ error: new Error('401 unauthorized') })
    const mockNavigateToLogin = jest.fn()

    const service = interpret(entranceMachine.withConfig({
      services: {
        fetchSession: mockFetchSession
      },
      actions: {
        navigateToLogin: mockNavigateToLogin
      }
    }))

    it('Goes to login page on fail', (done) => {
      service.onTransition((state) => {
        expect(state.matches(States.LOGGED_OUT))
        expect(mockNavigateToLogin).toHaveBeenCalled() // <- this test case always fails
        done()
      })
      service.start()
    })

通过将期望包装在 setTimout 周围，我设法使它以一种丑陋的方式工作。

setTimeout(() => expect(mockNavigateToLogin).toHaveBeenCalled(), 100)

我想知道是否有更好的选择？谢谢

4

0 回答 0