如何在react-redux-thunk中使用reducer编写动作的集成测试

豪尔赫·雷涛

我有一个函数,utils.fetch_json它返回一个json的承诺(或json中的某些错误)。我想测试一下,在fetch_json调度使用的动作updateData时,在API的json有效的情况下,使用json的有效负载更新了存储状态。

例子:

import {createStore,  applyMiddleware} from "redux";
import Store from "../../reducers/foobar";
import { updateData } from "../../actions/foobar";
import utils from '../../utils'
import thunk from 'redux-thunk';

const data = {
    a: ["A1", "A2"],
    b: [20, 10],
}

describe("Test the reducer-actions", () => {
    utils.fetch_json = jest.fn().mockResolvedValue(data);

    it("updates the state when updateData is dispatched", () => {
        const store = createStore(Store, applyMiddleware(thunk));
        store.dispatch(updateData())
        expect(store.getState().data).toEqual(data);
    });
});

这会失败,因为的执行store.dispatch(updateData())是异步的,因此expect会在其之前执行,从而导致初始状态(不是)data处于存储中。

我试图避免对此的依赖,但是如果表示法与笑话类似,我愿意使用它。

请注意,我并不是要:

  1. 隔离测试减速器
  2. 孤立地测试动作创建者
  3. 孤立地测试重击动作

我有兴趣在集成中对其进行测试。

HMR

如果updateData返回,则可以执行以下操作:

store.dispatch(updateData()).then(()=>test here)

那是假设updateData返回一个承诺。

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

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

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

React-redux:如何编写集成测试

来自分类Dev

如何在React中使用Redux的Provider

来自分类Dev

如何在Redux Toolkit的createSlice中使用Redux-Thunk?

来自分类Dev

如何在React上正确使用redux-thunk?

来自分类Dev

如何在redux-thunk中使用axios / AJAX

来自分类Dev

如何在Redux中使用React Context API?

来自分类Dev

如何在条件和Redux中使用React路由?

来自分类Dev

如何在 React JS 中使用 Redux 和 Axios?

来自分类Dev

了解如何在 react-redux 中使用 mapDispatchToProps?

来自分类Dev

如何在React + Redux中使状态更新异步

来自分类Dev

如何在React + Redux中使状态更新异步

来自分类Dev

如何在React-Native导航中正确使用Redux

来自分类Dev

如何使用 Jest Mock 模块测试 Redux Thunk 异步操作

来自分类Dev

我如何在React中使用React / Redux表单获取帖子值

来自分类Dev

如何在非伪造应用中编写异步redux动作

来自分类Dev

如何使用Typescript在Redux reducer函数中实现详尽的switch语句?如何处理Redux的内部@@ redux动作

来自分类Dev

如何在redux的动作上调用动作?

来自分类Dev

如何在getInitialProps中使用Redux钩子

来自分类Dev

如何在 redux 中使用异步操作

来自分类Dev

Redux Thunk 如何实现

来自分类Dev

在react-redux中使用bindactioncreator调度动作

来自分类Dev

如何在Redux中管理嵌套的reducer?

来自分类Dev

如何在Redux中创建Dynamic Reducer

来自分类Dev

如何在react-redux中使用传播运算符修改索引处的特定对象?

来自分类Dev

如何在React redux中使用Ajax调用加载初始数据集?

来自分类Dev

如何在Cordova中使用Redux正确初始化React应用-未调用mapStateToProps

来自分类Dev

如何在React Native / Redux中使用推送路由为NavigationStateUtils创建唯一键?

来自分类Dev

什么是Redux循环以及如何在React Native中使用它

来自分类Dev

如何在React和Redux中使用从asyncValidate函数返回的数据?

Related 相关文章

  1. 1

    React-redux:如何编写集成测试

  2. 2

    如何在React中使用Redux的Provider

  3. 3

    如何在Redux Toolkit的createSlice中使用Redux-Thunk?

  4. 4

    如何在React上正确使用redux-thunk?

  5. 5

    如何在redux-thunk中使用axios / AJAX

  6. 6

    如何在Redux中使用React Context API?

  7. 7

    如何在条件和Redux中使用React路由?

  8. 8

    如何在 React JS 中使用 Redux 和 Axios?

  9. 9

    了解如何在 react-redux 中使用 mapDispatchToProps?

  10. 10

    如何在React + Redux中使状态更新异步

  11. 11

    如何在React + Redux中使状态更新异步

  12. 12

    如何在React-Native导航中正确使用Redux

  13. 13

    如何使用 Jest Mock 模块测试 Redux Thunk 异步操作

  14. 14

    我如何在React中使用React / Redux表单获取帖子值

  15. 15

    如何在非伪造应用中编写异步redux动作

  16. 16

    如何使用Typescript在Redux reducer函数中实现详尽的switch语句?如何处理Redux的内部@@ redux动作

  17. 17

    如何在redux的动作上调用动作?

  18. 18

    如何在getInitialProps中使用Redux钩子

  19. 19

    如何在 redux 中使用异步操作

  20. 20

    Redux Thunk 如何实现

  21. 21

    在react-redux中使用bindactioncreator调度动作

  22. 22

    如何在Redux中管理嵌套的reducer?

  23. 23

    如何在Redux中创建Dynamic Reducer

  24. 24

    如何在react-redux中使用传播运算符修改索引处的特定对象?

  25. 25

    如何在React redux中使用Ajax调用加载初始数据集?

  26. 26

    如何在Cordova中使用Redux正确初始化React应用-未调用mapStateToProps

  27. 27

    如何在React Native / Redux中使用推送路由为NavigationStateUtils创建唯一键?

  28. 28

    什么是Redux循环以及如何在React Native中使用它

  29. 29

    如何在React和Redux中使用从asyncValidate函数返回的数据?

热门标签

归档