随着前端项目的复杂度不断提高，测试变得越来越重要。其中一个常见的测试方法是模拟 API 请求，并对模拟结果进行断言。@pollyjs/persister 就是一个用于模拟请求结果的 npm 包。
安装
首先，我们需要在项目中安装 @pollyjs/persister 和它的 peerDependency，@pollyjs/core。
npm install --save-dev @pollyjs/persister @pollyjs/core
使用
假设我们要测试一个发送 GET 请求获取用户信息的函数 getUserInfo：
async function getUserInfo(userId) {
const url = `https://example.com/api/user/${userId}`;
const response = await fetch(url);
const data = await response.json();
return data;
}我们可以使用 @pollyjs/persister 来模拟请求结果。首先，我们需要实例化一个 Polly 对象（主要是用来记录请求和响应）：
-- -------------------- ---- ------- ------ - ----- - ---- ---------------- ------ ---------- ---- ----------------------- ------ ----------- ---- ------------------------ --------------------------- ---------------------------- ----- ----- - --- --------------------- ------------ -- - -------------- ---
这个代码块还引入了 @pollyjs/adapter-xhr 和 @pollyjs/persister-fs。它们分别是 Polly 的适配器和持久化存储，在这里我们用 fs 持久化存储，实际上也可以用其他的存储方式。
接下来，我们用 Polly 对象来拦截 getUserInfo 函数的请求和响应：
-- -------------------- ---- -------
---------- --- ---- ------ ----- -- -- -
----- --------- - --------------------------
----- -----------------
--------- --------
---------- ---------------
----------------- ------------------
---
--------------------------------------------------------
----- ---- - ----- -----------------
------------------------------- ------
-----------------------------------------
-------------------------------------------
---这个代码块里，首先在 @pollyjs/persister-fs 中创建一个 persister 对象，然后用 polly.configure() 函数来配置 Polly 对象，包括使用 xhr 适配器、使用 fs 此持久化存储以及其他一些选项。然后用 polly.server.any() 函数来定义拦截的请求，最后调用 getUserInfo 函数进行测试。
如果在测试时运行多个使用 Polly 对象的测试文件，可以设置 persister 中的 recordIfMissing 选项，如果没有找到存储的模拟结果，则根据实际请求生成一个模拟结果并存储到 persister 中，以便下次使用。
const persister = polly.persister.get('fs', { recordIfMissing: true });结论
通过上述步骤，我们就可以使用 @pollyjs/persister 来模拟请求结果、记录请求和响应以及持久化存储模拟结果。这个库的目的就是帮助我们更好地测试前端项目。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/99818