前言
测试是前端开发中非常重要的一部分。在测试中，时间是一个非常关键的因素。在开发中，我们可能会依赖于一些异步操作，比如 setTimeout() 或者 Promise ，这会使我们的测试变得更加复杂。为了处理这种情况，我们可以使用 @jest/fake-timers 这个 npm 包。
它是 Jest 自带的时间模拟工具，可以帮助我们有效地模拟定时器。本文将为大家详细介绍如何使用该包。
安装
你需要安装 Jest 才能使用 @jest/fake-timers 。在安装 Jest 后，你可以使用 npm/yarn 安装该包。
npm install @jest/fake-timers --save-dev
基本使用
一旦安装了 @jest/fake-timers ，我们可以在测试文件中使用下面的代码块来启用假定时器。
// 导入 @jest/fake-timers
const { useFakeTimers } = require('@jest/fake-timers');
// 使用假定时器
const timer = useFakeTimers();这将返回一个计数器，可以是一个对象。我们可以使用它来控制定时器，例如 setTimeout 和 setInterval。
-- -------------------- ---- ------- -------- ------------ -- -- - ----- -- - ---------- -------------- ------ -- ------ ------------------------------- ---------------------------- ------------------------------- ------------------------ ---
在上面的代码示例中，我们首先将一个函数传递给 setTimeout，然后我们使用 advanceTimersByTime() 来模拟时间的流逝。在 500ms 之后，回调函数 fn 是不会被调用的，因为在这个时间段内，我们只推进了一半的时间。但在 1000ms 之后，fn 被调用了，因为此时所有时间都被成功推进了。
同样的方式也可以用于 setInterval：
-- -------------------- ---- ------- -------- ------------- -- -- - ----- -- - ---------- --------------- ------ -- ------ ------------------------------- ---------------------------- ------------------------------- ------------------------ ------------------------------------ -------------------------------- ------------------------------------ -------------------------------- ------------------------------------ ---
Mock 快照时间戳
有时候我们的测试需要使用 Date.now() ，@jest/fake-timers 也可以轻松地模拟这种行为。
-- -------------------- ---- ------- -------- ------------ -- -- - ----- ----------- - ---------------- ------- --------------------------------- ----------------------------- -------------------------------- ------------------------------ -- -- ---------- -------------------------- --
我们使用了 jest.spyOn() 先监听了 Date.now() 函数，然后使用 mockReturnValue() 来让它在第一次被调用时返回固定的值 100。使用 advanceTimersByTime() 推进时间后，再次调用 Date.now() 函数，你会看到返回了正确的时间。
不要忘记在测试完成后恢复 Date.now() 函数，否则它将影响到其他测试。
打破测试的壁垒
有时候，我们想要在测试内部执行异步测试操作。使用 @jest/fake-timers，可以轻松地获得这个功能。
-- -------------------- ---- -------
----------------- -- -- -
--------------- -- -- -
---------------------
------ --- --------------- -- -
------------- -- -
------------------------
----------
-- ------
---
---
---在上面的示例中，我们执行了 setTimeout 并使用了一个 Promise，在 setTimeout 中的回调函数结束后才会调用 resolve 函数。我们使用 expect.assertions() 来确保我们有两项断言（两行 expect）。如果我们没有使用 setTimeout ，测试就会失败，因为执行会在返回 Promise 之前结束。
总结
本文我们详细讲解了如何使用 @jest/fake-timers 包来处理测试中的时间问题，并展示了如何使用假定时器来推进时间，模拟异步操作，以及如何使用 Jest 自带的 Mock 来打破测试的限制。我们希望这篇文章对你有所帮助。如果你还有任何疑问或有关于使用相同或相关工具的问题，请在评论区留言让我们知道。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedadabb5cbfe1ea0610ce4