前言
在前端开发中，使用 Redux 管理应用的状态是很常见的做法，而 redux-promise-test 是一个可以帮助我们测试 Redux 异步 action 的工具，本文将会讲解如何使用这个工具。
安装
使用 npm 安装 redux-promise-test 。
npm install redux-promise-test --save-dev
使用
1. 创建测试用例
我们先来创建一个简单的测试用例，假设我们的应用中有一个异步 action 叫做 fetchData ，它会去请求后端 API 并返回数据。
-- -------------------- ---- -------
------ - --------- - ---- ------------
--------------------- -- -- -
---------- ----- ---- ---- ----- -- -- -
------ -
------ ---------------------
------- ------------
---------------- -
- ----- --------------- --
- ----- ---------------- -------- - ----- ----- ----- - -
-
--
---
---这个测试用例包括了一个测试用例名称、一个 it 语句和一个返回对象。返回对象包括了一个 store 对象，一个 action 对象和一个期望的 action 数组。
2. 创建测试文件
我们新建一个 test 文件夹并在其中创建一个 fetchData.test.js 文件：
mkdir test touch test/fetchData.test.js
3. 运行测试
在 package.json 的 scripts 中添加一条命令来运行测试：
"test": "mocha --require babel-register './test/**/*.test.js'"
现在可以通过 yarn test 或 npm test 来运行测试。
示例代码
下面是一个完整的测试代码示例，其中包括了真正的 API 调用以及 redux-promise-test 的使用：
-- -------------------- ---- -------
------ ------------------ ---- -------------------
------ ----- ---- --------------
------ --------- ---- -------------
------ ----------------- ---- ----------------
------ - ----------- - ---- -------------
----- ----------- - ------- -------------------
----- --------- - --------------------------------
--------------- -------- -- -- -
------------ -- -
--------------------
---
---------- ------ ------------- ---- -------- --- ---- ------ -- -- -
----------------------------------------------------------- -
----- - ------ ---- ----------- --
-------- - --------------- ------------------ -
---
----- --------------- - -
- ----- ------------- --
- ----- ---------------- -------- - ------ ---- ----------- - -
--
----- ----- - ----------- ------ -- ---
------ ------------------------------------- -- -
----------------------------------------------------
---
---
---总结
redux-promise-test 是一个方便的工具，它帮助我们测试 Redux 异步 action。在使用这个工具时，我们先需要创建一个测试用例，然后在测试文件中使用 redux-mock-store 来创建一个 store 对象并使用 async/await 或 Promise 来执行 action 并测试结果。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006700fe361a36e0bce8d30