Redux 是一种 JavaScript 应用程序状态管理工具，广泛用于 React 应用程序中。对于开发者来说，编写测试是确保应用程序质量的重要部分。Jest 是一种流行的 JavaScript 测试框架，已经成为 Web 开发人员的首选工具之一。在这篇文章中，我们将介绍 Jest 如何用于测试 Redux，以及如何编写和运行测试用例。
安装 Jest
首先，让我们安装 Jest。通过 NPM 安装 Jest：
npm install --save-dev jest
现在，我们已经安装了 Jest，现在可以开始使用它来测试 Redux。
编写测试用例
现在我们已经安装了 Jest，接下来我们将编写一个测试用例。我们将测试 Redux 中的 action 和 reducer，以确保它们正常工作。这是一个简单的例子，但是你可以根据你的需求扩展它。
测试 Action
在 Redux 中，Action 是一个带有 type 属性的纯对象。它描述了应用程序中发生的事情，以及将要更改应用程序状态的内容。
我们将编写一个用于测试 Redux action 的测试用例。这里是如何编写测试用例的代码示例：
-- -------------------- ---- -------
------ - ------- - ---- -----------
------------------- -- -- -
---------- --- - ------ -- -- -
----- ---- - ----- -------
----- -------------- - -
----- -----------
----
-
---------------------------------------------
--
--在这个测试用例中，我们首先导入我们的 addTodo action。然后，在测试套件中，我们编写了一个测试用例，用于测试我们的 addTodo 方法是否正确生成了一个 action。我们创建了一个带有 text 和 type 的对象，以描述该事件的类型和需要更改的状态。这个对象是我们的预期输出，应该与我们实际测试的 addTodo 方法的结果完全相同。
测试 Reducer
在 Redux 中，Reducer 是一个纯函数，它接收应用程序状态和 Action，并返回应用程序的新状态。我们将编写一个测试用例来测试我们的 Reducer。
对于我们的测试，我们将模拟一个 Action，然后使用此 Action 调用 Reducer 来更新状态。最后，我们将检查更新后的状态与我们的预期输出是否相同。
这边给出一个示例代码：
-- -------------------- ---- -------
------ - ----- - ---- ------------
------ -
---------
-----------
- ---- -----------
-------------------- -- -- -
----------------- -- -- -
---------- ------ --- ------- ------- -- -- -
----------------------- ----------------
--
---------- ------ ---------- -- -- -
----- ------- - -
----- ----- ------
---------- -----
-
----- ------ - -
----- ---------
----------
-
---------------- ---------------------------
--
---------- ------ ------------- -- -- -
----- ------- - -
--- --
----- ----- ------
---------- -----
-
----- ------ - -
----- ------------
--- -
-
----------------------- ------------------- ----------- ---------- ---- ---
--
--
--在这个测试用例中，我们首先导入我们的 Reducer 和一些 Action。然后，我们编写了三个测试用例来测试 Reducer。第一个测试用例测试我们的 Reducer 是否返回正确的初始状态。第二个测试用例使用 ADD_TODO Action 更新状态并检查状态是否正确。最后一个测试用例使用 TOGGLE_TODO action 更改状态并检查状态是否正确更新。
运行测试用例
完成了测试用例的编写之后，我们需要运行测试以确保它们都能正常工作。有多种方式可用于运行 Jest 测试用例，但是我们将在这里介绍使用 npm 的方式。
在项目的 package.json 文件中，将以下内容添加到 scripts 部分中：
"test": "jest"
然后，在终端中运行以下命令：
npm run test
Jest 将开始运行你编写的所有测试用例，并显示测试结果。
结论
现在你应该掌握了如何使用 Jest 测试 Redux，以及如何编写和运行测试用例。这是确保应用程序质量和稳定性的重要步骤，你应该优先考虑使用测试来帮助你更好的编写和维护更好的代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6732e7b00bc820c5823f712d