在前端开发中，使用 Redux 管理应用程序的状态已经成为了一种很流行的做法。Redux 可以使得我们的应用程序更加易于理解和维护。然而，在测试方面，Redux 需要我们使用特定的工具来测试异步 Action，其中 Enzyme 是一个被广泛使用的测试库之一。
本文将介绍如何使用 Enzyme 来测试 Redux 中的异步 Action，同时提供示例代码来帮助您更好的理解。
1. Enzyme 简介
Enzyme 是 React 的一个 JavaScript 测试实用工具，由 Airbnb 开发和维护。Enzyme 可以让您测试 React 组件和应用程序的输出。Enzyme 提供了一个类似 jQuery 的 API，使得访问和交互组件的输出变得更加容易。Enzyme 支持多种渲染策略（shallow, mount, render），每种策略都有自己的优缺点，可以根据需要选择使用哪种策略。
这里我们将使用 Enzyme 的 shallow 渲染策略，因为它更轻量级，适合测试 Redux Action。
2. Redux 异步 Action 简介
Redux 异步 Action 可以在后台运行异步代码，例如发送请求并在成功或失败后修改应用程序的状态。异步 Action 需要通过 Redux-Thunk 中间件来执行，因为 Redux 更新状态是同步的。
在测试 Redux 异步 Action 时，我们需要模拟异步行为，例如模拟 API 调用，在模拟异步行为时，最常用的方法是使用 Jest 提供的 jest.Mock 实现，将 Promise 等函数和组件进行 mock，然后在测试中手动执行 Promise 的 resolve 或 reject 方法，来测试 Action 返回的 Promise 是否符合预期。
3. Enzyme 测试 Redux 异步 Action
下面是一个使用 Enzyme 测试 Redux 异步 Action 的示例代码：
------ - --------- - ---- ---------
------ ------- ---- --------------------------
------ - ------- - ---- ---------
------ -------------- ---- -------------------
------ ----- ---- --------------
------ - --------- - ---- ------------
----------- -------- --- --------- ---
----- --------- - ------------------------
----- -------- - -- --- -- ----- ------ -- - --- -- ----- ------ ---
--------------------- -- -- -
--------- ---- -------------- -- -- -
----- ----- - -----------
----- ---
---
------------ - ------------------------------- --
-----------------
----- -- -- --------------------------
--
--
----- --------------- - -- ----- --------------------- -------- -------- ---
------ ----------------------------------- -- -
----------------------------------------------------
----------------------------------------------
---
---
---在这个例子中，我们使用了 Redux-Mock-Store 和 Enzyme 来测试 Redux 异步 Action。首先，我们设置模拟 store 和模拟数据来模拟应用程序，然后在测试中，我们调用 fakeData 来模拟异步数据，在测试中自动执行 fetch 函数返回的 Promise，最后判断 Action 是否符合预期。
4. 总结
Enzyme 是一个很好的测试工具，可以帮助我们轻松地测试 Redux 异步 Action。然而，开发者应该清楚测试不是应用程序的代替，应该尽可能的减少测试的依赖，并确保每一个测试都是必要的。
另外，开发者在使用 Enzyme 测试 Redux 异步 Action 时，也要注意一些基本的测试原则，例如选择合适的测试策略，理解 Redux 异步 Action 的基本概念和范畴，以及确保每个测试都是精简和清晰的。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64896dfa48841e98947b6c14