介绍
Jest 是一个流行的 JavaScript 测试框架，它提供了简单易用的测试工具和丰富的 API。除了基本的测试用例编写和单元测试外，Jest 还支持模拟（Mock）功能，这是一个非常有用的功能，特别是在测试某些有许多依赖的模块时。其中最强大的功能是 Mock Function。
Mock Function 是一个假的函数对象，可以模拟真实的函数行为，包括参数、返回值等。这个假的函数在测试中可以替换掉真实的函数，从而可以方便地测试被测代码和各种场景和边界情况。
在本文中，我们将深入了解 Jest Mock Function 的实现和使用，包括：
- Jest Mock Function 的创建和配置
- 使用 Jest Mock Function 模拟函数执行
- 模拟 Jest Mock Function 的返回值和异常
- 使用 Jest Mock Function 检查函数的调用、参数和次数
- 使用 Jest Mock Function 模拟异步函数
- 使用 Jest Mock Function 优化测试代码
我们将通过一些实际的代码示例来展示这些功能，并给出实际的指导意义和最佳实践。
Jest Mock Function 的创建和配置
在 Jest 中，我们可以使用 jest.fn() 来创建一个 Mock Function。
------------ - ---- ---- ---------- -- -- - ----- ------ - ---------- ------------- ------------------------- ---
这样，我们就创建了一个名为 mockFn 的 Mock Function。这个函数的默认行为是，当被调用时不做任何事情，直接返回 undefined。我们接下来可以通过配置来控制这个函数的模拟行为。
使用 Jest Mock Function 模拟函数执行
我们可以使用 Mock Function 代替真实函数，在测试中模拟它们的执行。比如下面这个例子，我们可以使用 Mock Function 来模拟一个 getUserName 函数，然后测试一个依赖它的 getUserGreeting 函数。
-------- --------------- - -- ---- -------------- - -------- ------------------- - ----- ---- - ---------------- ------ ------- ---------- - --------------------- ------ ------ --- ------- ---------- -- -- - ----- --------------- - ---------------------------------- ----- ------ - --------------------- --------------------------- -------- ------------------------------------------------- ---
在上面的测试中，我们模拟了 getUserName 函数，返回了一个假的用户名 John。然后我们使用这个 Mock 函数来测试 getUserGreeting 的行为。我们期望它返回一个包含正确用户名的问候语，且 getUserName 函数只被调用了一次。
模拟 Jest Mock Function 的返回值和异常
Mock Function 还可以用来模拟函数的返回值和异常。我们可以使用 mockReturnValue 来设置 Mock 函数的默认返回值，或者链式调用多个 mockReturnValue 来设置在不同参数下的返回值。我们还可以使用 mockResolvedValue 和 mockRejectedValue 来模拟异步函数的返回值和异常。
---------- -------- --- -------- ------ ----- --- ----------- ----- -- -- -
----- ------- - ----------
----------------------------
-------------------------------------------------------------------------
--------------------------
--------------------------
--------------------------
--------------------------
----------------------------- -- -
----- --- ----------- --------
---
----- --------------------------------------- --------
---上面的代码中，我们定义了一个名为 mockApi 的 Mock Function，然后用多个 mockReturnValue 来设置不同情况下的返回值。我们还使用了 mockImplementation 来模拟一个抛出异常的函数实现，并通过 rejects.toThrow 来测试异步函数抛出异常的情况。
使用 Jest Mock Function 检查函数的调用、参数和次数
Mock Function 还可以用来检查一个函数被调用的次数、调用时传入的参数等等。我们可以使用 mock.calls 来获取 Mock 函数的调用记录，使用 mock.results 来获取 Mock 函数的执行结果，使用 mockName 来设置 Mock 函数的名称，使用 mockClear 来清空 Mock 函数的状态等等一系列功能。
---------- -------- --- ----- --- -------- ----- --- ------------ -- -- - ----- ------ - ---------- -------------- ------- --------------- ------- -------------- ------- ---------------------------------------- ------------------------------------------- ------- ----------------------------------------- -------- ------- ------------------------------------------- ------- --------- ------- -------- --------- ------------------- ---------------------------------------- ---
上面的代码中，我们可以看到如何使用 toHaveBeenCalledTimes、toHaveBeenCalledWith 和 toHaveBeenNthCalledWith 这些 API 来检查 Mock 函数的调用次数和参数。我们还可以通过 mock.calls 来获取所有调用的参数列表，并通过 mockClear 来清空 Mock 函数的状态。
使用 Jest Mock Function 模拟异步函数
Mock Function 还可以用来模拟异步函数的执行，例如通过 mockResolvedValue 和 mockRejectedValue 来模拟异步函数的返回值和异常。Mock Function 还有一些 API 可以用来模拟异步函数的行为，例如 mockImplementationOnce 和 mockReset 等。
-------- ------------- -
------ ------------------------------ -- ------------
-
---------- -------- --- -------- --- -------- -- ----- ----------- ----- -- -- -
----- --------- - ----------
----------------------------- ----- ----- ----- ---- -- ---
----- ------ - ----- ---------------
------------------------ ----- ----- ----- ---- -- ---
-------------------------------------------
--------------------------------- ----- ------ ------- ---- -- ---
--------------------------------- ----- ---- ------- ---- -- ---
------------ ------------------------- ----- ------ ------- ---- -- ---
------------ ------------------------- ----- ---- ------- ---- -- ---
------------------------------- -- -
----- --- ----------- --------
---
----- -------------------------------------------- --------
-------------------------------------------
----------------------
-----------------------------------------
---上面的代码中，我们使用 Mock Function mockFetch 来模拟异步函数 fetchUser 的行为。我们使用 mockResolvedValue 和 mockResolvedValueOnce 来模拟异步函数的返回值，使用 mockImplementation 来模拟抛出异常的情况。我们还使用 mockReset 来清空 Mock 函数的状态。
使用 Jest Mock Function 优化测试代码
Mock Function 可以帮助我们编写更加可靠和可维护的测试代码，但是过度使用它也会产生一些问题。例如我们可能会跳过某些重要的测试用例，或者在代码中直接修改 Mock 函数来达到特定的测试覆盖率等等。因此，为了使用 Mock Function 更加明智，我们需要保持代码简洁且具有可读性。
---------- -------- --- ---- -- ----- ------ ---- ------ ----- -- -- - ----- ------- - --------------------------------- -------- ----- ------- - --------------------------------- -- ------- ---------- ----- ------- - ----------------------------- ----- ----- ----- ---- -- --- ------------------------------ -------- ------------------------------------- -------- ------------ -------------------- ----- ----- ----- ---- -- --- ---
上面的代码中，我们使用 Mock Function 来模拟不同的函数行为。我们可以看到，Mock Function 可以让我们编写更加简洁和清晰的测试代码，而不用依赖复杂的数据结构或者困难的边界情况。
结论
Jest Mock Function 是一种非常强大和有用的测试工具，它可以让我们模拟不同的函数行为、检查函数的调用和参数、模拟异步函数等等。使用 Jest Mock Function 可以让我们编写更加可靠和可维护的测试代码，并且可以帮助我们快速排除问题。
然而，我们需要保持谨慎和清醒，不要过度使用 Mock Function，保持代码简洁和易于理解。使用 Mock Function 最佳实践是，只在必要的情况下使用它，避免直接修改 Mock 函数和跳过关键测试用例等等。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6721a9fa2e7021665e086918