在前端开发中，我们经常需要使用 window 对象来访问浏览器的 API。然而，在进行单元测试时，我们需要模拟这些 API，以确保代码的正确性和可靠性。但是，如何在 Jest 单元测试中 Mock 掉 window 对象呢？接下来，我们将详细讨论这个问题。
为什么需要 Mock window 对象？
在进行单元测试时，我们通常需要模拟一些 API，以确保代码的正确性和可靠性。例如，我们可能需要模拟浏览器的 DOM API，如 document、window、location 等。这些 API 在浏览器环境中是存在的，但在 Node.js 环境中并不存在。因此，我们需要使用一些工具来模拟这些 API，以便在 Node.js 环境中进行单元测试。
如何 Mock window 对象？
在 Jest 中，我们可以使用 jest.mock() 方法来模拟 window 对象。具体步骤如下：
- 创建一个空对象，作为模拟的 window 对象。
const mockWindow = {};- 使用 jest.mock() 方法来模拟 window 对象。在该方法中，我们需要传递一个模拟对象和一个模块路径。
jest.mock('path/to/window', () => mockWindow);- 在测试用例中，我们可以使用 jest.spyOn() 方法来创建一个 spy，以便在测试过程中监视 window 对象的方法调用。
const spy = jest.spyOn(mockWindow, 'alert');
- 在测试用例中，我们可以调用被测试的代码，并断言 window 对象的方法是否被正确调用。
expect(spy).toHaveBeenCalled();
下面是一个完整的示例代码：
-- -------------------- ---- -------
-- --------
-------- ----------- -
-------------------- ---------
-
-- -------------
--------------------- -- -- -
----- ---------- - ---
--------------------------- -- -- ------------
------------ ---- -------------- -- -- -
----- --- - ---------------------- ---------
------------
-------------------------------
---
---总结
在 Jest 单元测试中，我们可以使用 jest.mock() 方法来模拟 window 对象。具体步骤包括创建一个空对象作为模拟的 window 对象，使用 jest.mock() 方法来模拟 window 对象，使用 jest.spyOn() 方法来创建一个 spy 监视 window 对象的方法调用，以及在测试用例中断言 window 对象的方法是否被正确调用。这些技巧可以帮助我们更好地进行单元测试，提高代码的质量和可靠性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65d95f761886fbafa46f1ecd