Redux 工具箱是一个强大的 Redux 增强工具，可以让 Redux 开发更加高效和简洁。然而，在开发过程中，为了确保代码的质量和稳定性，我们需要进行测试。本文将介绍如何使用 Jest 测试 Redux 工具箱。
在开始之前，我们需要确保安装了以下依赖项：
- Jest
- Redux
- Redux 工具箱
如果还没有安装，请先执行以下命令进行安装：
npm install --save-dev jest redux @reduxjs/toolkit
创建一个简单的 Redux 工具箱
首先，让我们创建一个简单的 Redux 工具箱。我们将创建一个包含两个 action 和一个 reducer 的工具箱。
在 src 目录下创建一个 counterSlice.js 文件，内容如下：
-- -------------------- ---- -------
------ - ----------- - ---- ------------------
----- ------------ - -------------
----- ----------
------------- --
--------- -
---------------- -
------ ----- - -
--
---------------- -
------ ----- - -
-
-
--
------ ----- - ---------- --------- - - --------------------
------ ------- --------------------createSlice 函数接受一个配置对象，包含四个属性：
name：工具箱的名称（字符串）。initialState：状态的初始值。reducers：一个对象，其中包含可用于更改状态的 action 的名称及其 reducer 函数。
在该文件中，我们定义了一个名为 counter 的工具箱，它包含两个 action：increment 和 decrement，以及一个 reducer，它根据每个 action 更新状态。
编写测试用例
现在，我们将创建一个测试用例来测试我们的工具箱是否按预期工作。在 src 目录下创建一个 counterSlice.test.js 文件，并编写如下测试用例：
-- -------------------- ---- -------
------ --------------- - ---------- --------- - ---- ----------------
----------------- --------- -- -- -
---------- ------ --- ------- ------- -- -- -
-------------------------------- ---------------
--
---------- ------ ----------- -- -- -
------------------------ ------------------------
--
---------- ------ ----------- -- -- -
------------------------ ------------------------
--
--在这个测试用例中，我们测试了三种情况：
undefined的状态下，counterReducer函数是否返回正确的默认值（0）。INCREMENTaction 是否能正确地增加状态的值。DECREMENTaction 是否能正确地减少状态的值。
运行测试
现在，我们已经编写了测试用例，接下来我们需要在终端中运行它。在 package.json 文件中添加以下脚本：
{
"scripts": {
"test": "jest"
}
}运行 npm run test 命令，Jest 将执行测试并输出测试结果：
-- -------------------- ---- -------
- --- --- ----
- ----
---- ------------------------
------- -------
- ------ ------ --- ------- ----- -- ---
- ------ ------ --------- -- ---
- ------ ------ --------- -- ---
---- ------- - ------- - -----
------ - ------- - -----
---------- - -----
----- ----- -- --------- - -
--- --- ---- -------可以看到，我们编写的测试用例已经全部通过了。
结论
在这篇文章中，我们学习了如何使用 Jest 测试 Redux 工具箱。我们创建了一个简单的工具箱，并编写了测试用例来测试其功能。使用这种方法，我们可以确保我们的 Redux 工具箱代码的质量和稳定性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66fbd9f34471362601655d22