如何使用fetch API请求测试操作创建者

时间:2017-10-31 20:02:06

标签: reactjs testing redux jest create-react-app

我有一个用Redux和Jest进行测试的create-react-app。我正在使用fetch来从动作创建者发出API请求。在我编写测试时,我发现无论如何 - 无论如何我试图模拟这个请求 - 它仍然试图向API发出实际请求并获得网络连接错误(所以我从请求中得到了每个请求测试的时间)。值得一提的是,这在浏览器中运行良好。

#page-right-content

我试过这个 - https://medium.com/@ferrannp/unit-testing-with-jest-redux-async-actions-fetch-9054ca28cdcd

我也厌倦了这一点 - https://medium.com/@kellyrmilligan/testing-async-actions-in-redux-with-isomorphic-fetch-and-fetch-mock-35f98c6c2ee7

基本上花了几天时间试图解决这个问题。

我做错了什么?有机会获得如何测试此操作的实例吗?

谢谢!

1 个答案:

答案 0 :(得分:1)

您想要准确测试什么?对于模拟False,有类似fetch-mock的内容,但也许您也可以重构代码,使其不直接依赖于fetch的工作。

例如,要检查是否已分派正确的操作,您可以使用以下内容:

fetch

现在,您可以通过传入返回好/有效负载的函数和make sure that the right actions are dispatched来测试您的方法。在普通代码中,您可以按原样使用export function getEmployeeDetails(fetcher, id) { return async dispatch => { let payload = await fetcher(id); if (/* payload is good */) { dispatch(getEmployeeDetailsSuccess(payload.user)); } else { dispatch(errorCatch(err)) } }; } ,但是传递一个处理该逻辑的函数,而不是直接将其包含在动作创建器中。