当我们在编写前端应用程序时，我们经常需要与异步操作打交道，比如在异步请求响应后更新页面内容。而 Promise 是处理异步操作的一种常见方式。在 Jest 测试中，我们也需要处理 Promise。
在本篇文章中，我们将介绍如何在 Jest 测试中使用 Promise，让你的测试更加全面、准确。
Promise 基础
在介绍 Jest 中 Promise 的使用方法之前，先简要介绍一下 Promise 基础。
Promise 是 ECMAScript 2015（ES6）规范中新增的一种用于处理异步操作的对象。它可以将异步操作以同步的方式进行处理，让代码更加易于编写和维护。
Promise 有三个状态：
pending：Promise 对象初始状态，即未完成的状态。fulfilled：Promise 对象已经成功完成异步操作，即已执行resolve。rejected：Promise 对象已经发生错误，即已执行reject。
Promise 对象通过调用 then 方法设置成功和失败的回调函数。
-- -------------------- ---- -------
----- --------- - --- ----------------- ------- -- -
----- --------- - --------------
-- ---------- - ---- -
-------------------
- ---- -
----------------
-
---
---------------------- -- -
-------------------
-- ------- -- -
-------------------
---Jest 中 Promise 的使用方法
在 Jest 测试中，我们用 async/await 关键字来处理 Promise。async 用于声明异步函数，await 用于暂停异步函数的执行，直到 Promise 完成。这使得异步代码的测试更加方便。
下面是一个简单的例子。我们将测试使用 Promise 获取一个用户信息的 API 是否正常工作。
test('get user info', async () => {
const res = await fetch('https://jsonplaceholder.typicode.com/users/1');
const userData = await res.json();
expect(userData.name).toEqual("Leanne Graham");
});首先声明一个异步测试函数。在测试函数内使用 await fetch() 异步请求数据并等待请求返回，使用 await res.json() 将请求结果转换为 JSON 对象。最后使用 Jest 的 expect 断言，验证返回的数据是否与期望相符。
Promise 超时测试
有些异步操作需要一定时间才能完成。在 Jest 中，我们可以通过设置超时时间，确保异步操作在规定时间内执行完毕。如果异步操作在超时时间内未完成，测试将会失败。
test('get user info timeout', async () => {
const res = await fetch('https://jsonplaceholder.typicode.com/users/1');
const userData = await res.json();
expect(userData.name).toEqual("Leanne Graham");
}, 5000);在测试函数的最后一个参数中，使用毫秒表示超时时间。如果超时，将会抛出 TimeoutError。
Promise 错误捕获
最后，我们来看如何在 Jest 中捕获 Promise 的错误。
在前面的例子中，如果发生了错误，比如 URL 地址不存在或者请求超时，我们并没有处理它们。为了正确处理错误，我们可以使用 try-catch 语句，来捕获 Promise 中的错误。
-- -------------------- ---- -------
--------- ---- ---- ------- ----- -- -- -
--- -
----- --- - ----- ----------------------------------------------------------------
----- -------- - ----- -----------
------------------------------------- ---------
- ----- ------- -
-------------------------------------------- ------ -- --------
-
---在测试函数内使用 try-catch 语句，来捕获错误，用 Jest 断言验证错误是否符合预期。
总结
在 Jest 测试中使用 Promise，可以使你的测试更加准确、全面、易于维护。本文介绍了 Promise 基础、Jest 中 Promise 的使用方法，以及超时测试和错误捕获。如果你还没有使用 Jest 进行测试，建议去尝试一下。这将帮助你写出更加健壮的前端应用程序，并减少 bug 出现的概率。
示例代码：https://github.com/jasminejia/jest-promise-demo
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65af7959add4f0e0ff8ea7fb