在前端开发中，React 和 Redux 都是非常流行的技术。在进行单元测试时，我们需要对这些技术进行测试，以保证代码的质量和稳定性。而在 Jest 中使用 Jest.spyOn 可以帮助我们跟踪 React Redux 动作，以便更好地进行测试。
什么是 Jest.spyOn
Jest.spyOn 是 Jest 提供的一个函数，用于跟踪指定对象上的特定方法的调用情况。它可以帮助我们在测试中模拟特定的函数调用，以便更好地控制测试的结果。
如何在 Jest 中使用 Jest.spyOn
在使用 Jest.spyOn 进行测试时，我们需要先引入它，并指定需要跟踪的对象和方法。例如，我们可以使用以下代码跟踪 Redux 中的 dispatch 方法：
------ - ----------- - ---- --------
-------------- ---------- -- -- -
---------- -------- ------ ----------- -- -- -
----- ----- - ------------------ - --- -- -------
----- ----------- - ----------------- ------------
---------------- ----- ------------- ---
------------------------------------------ ----- ------------- ---
---
---在上面的代码中，我们先使用 createStore 创建了一个 Redux store 对象，并使用 Jest.spyOn 跟踪了它的 dispatch 方法。然后，我们调用了 store.dispatch 方法，并使用 expect 断言来验证该方法是否被正确地调用了。
在 React Redux 中使用 Jest.spyOn
在 React Redux 中，我们通常需要跟踪 action creators 和 reducers 的调用情况。以下是一个示例代码，演示了如何使用 Jest.spyOn 跟踪 action creators 和 reducers 的调用情况：
------ - -------- - ---- --------------
------ - ----------- - ---- --------
------ - ------ - ---- -------------------------
------ --------- ---- ------------------------------
------ --- ---- --------
-------------- ----- -- -- -
---------- -------- ------ ----------- -- -- -
----- ------------ - - ------ - --
-------- ------------- - ------------- ------- -
------ ------------- -
---- ------------
------ - ------ ----------- - - --
---- ------------
------ - ------ ----------- - - --
--------
------ ------
-
-
----- ----- - ---------------------
----- ----------- - ----------------- ------------
----- - ----------- - - -------
--------- --------------
---- --
-----------
--
----- --------------- - --------------------------------
----- --------------- - --------------------------------
---------------------------------
------------------------------------------ ----- ----------- ---
---------------------------------
------------------------------------------ ----- ----------- ---
---
---在上面的代码中，我们先创建了一个 Redux store，并使用 Jest.spyOn 跟踪了它的 dispatch 方法。然后，我们使用 render 函数渲染了一个包含 App 组件的 Provider，并使用 getByTestId 获取了 App 组件中的两个按钮。最后，我们使用 userEvent 模拟了按钮的点击事件，并使用 expect 断言来验证 action creators 和 reducers 是否被正确地调用了。
总结
在 Jest 中使用 Jest.spyOn 可以帮助我们跟踪 React Redux 动作，以便更好地进行测试。在使用 Jest.spyOn 进行测试时，我们需要先引入它，并指定需要跟踪的对象和方法。然后，我们可以使用 expect 断言来验证方法的调用情况是否符合预期。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/66307a2cd3423812e4e6056f