在前端开发中，单元测试是不可或缺的一环。而 Jest 作为一款流行的 JavaScript 测试框架，由于其简单易用和丰富的功能，越来越受到开发者的青睐。然而，在进行单元测试时，常常需要模拟外部模块的返回值，以便更好地完成测试。在这篇文章中，我们将详细介绍 Jest 如何 Mock 外部模块。
Mock 外部模块
首先，我们需要了解什么是外部模块。在 Jest 中，当我们需要测试的模块需要调用另一个模块时，我们就需要将其称为外部模块。这时，为了方便测试，我们需要对该外部模块进行 Mock，以便在测试时能够更好地控制其行为。
下面，我们来看一下如何 Mock 外部模块。我们假设有一个 app.js 的文件，它使用了 axios 模块来访问远程服务器，并将服务器返回的数据进行处理后输出到控制台。而我们需要对 axios 模块进行 Mock，以便在测试时能模拟服务器返回的数据。下面是 app.js 的内容：
-- -------------------- ---- ------- -- ------ ----- ----- - ----------------- ----- -------- ----------- - ----- -------- - ----- ------------------------------------------ ----- ---- - -------- -- -------------- ------------------ - ------------
为了 Mock axios 模块，我们需要在测试文件中引入 jest.mock 方法并在其内部进行 Mock。下面是相关的示例代码：
-- -------------------- ---- -------
-- -----------
------------------ -- -- --
---- ---------- -- ----------------- ----- ------- ----- ---
----
--------------------- -- -- -
----------- ---- -------------- ----- -- -- -
----- ---------------------------------------------
------------------------------------------------ -------
---
---上述代码中，我们使用了 jest.mock 方法来对 axios 模块进行 Mock。其中，我们使用了 Jest 提供的 jest.fn 方法来创建一个 Mock 函数，用于模拟 axios 模块中的 get 方法。该 Mock 函数的返回值为一个 Promise，它的解析值为一个包含 data 属性的对象。在测试中，我们使用了 expect 和 resolves 来验证 fetchData 方法是否成功解析返回的 Promise。同时，我们还通过 toHaveBeenCalledWith 方法，验证了 Mock 后的 console.log 方法是否被正确调用。
参考文献
- Jest - Mocking Modules
- Jest - Jest.fn() API
总结
在这篇文章中，我们了解了 Jest 如何 Mock 外部模块，以及使用 Mock 来完成单元测试的流程。对于前端开发者而言，单元测试已经成为一种重要的技能，而掌握 Jest 如何 Mock 外部模块则是其中必备的一环。希望本文能帮助读者更好地理解 Jest，并在实践中收获更多的技能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64782047968c7c53b046369f