使用像 Playwright 这样的端到端测试框架时，处理网络请求通常是一项复杂的任务。依赖外部 API 的测试可能会很慢且不一致，从而引入不必要的不稳定。由于服务器缓慢或不可靠，在一次测试运行中成功的网络调用可能在下一次测试运行中失败，从而导致结果不一致。为了解决这个问题，开发人员经常诉诸模拟网络请求，这带来了另一个挑战：管理模拟。
如果有一种自动化的方式来处理缓存和重用网络响应而不需要设置复杂的模拟策略，这不是很棒吗？我研究了现有的方法并开发了一个我想介绍的工具。它通过在文件系统上缓存网络请求来解决这些具体问题，从而实现更快、更可靠的 Playwright 测试。
网络请求通常是测试执行中最慢的部分。运行多个测试套件时，重复查询外部 API 会显着增加测试持续时间。此外，现实世界的 API 可能不稳定，偶尔会超时，使您的测试脆弱且不可靠。
缓解这种情况的常见方法是模拟 API 响应。虽然有用，但模拟需要手动干预 - 您需要仔细构建模拟响应，不断更新它们，并确保处理每个潜在的网络场景。随着 API 的发展或测试用例的变化，这可能会成为巨大的维护负担。 Playwright 支持 HAR 文件来捕获和重放网络流量，但使用 HAR 可能很乏味，并且缺乏动态修改响应的灵活性。
playwright-network-cache 旨在简化 Playwright 测试中缓存网络响应的过程，消除对手动模拟或严格的 HAR 文件的需要。有了这个库，网络响应在第一次测试运行期间会自动存储在文件系统上，并且可以在后续运行中重用，从而显着加快测试执行速度。此外，响应保存在清晰、有组织的文件夹结构中，可以轻松根据需要检查和修改它们。
自动缓存：第一次运行测试时，库会自动缓存网络响应。这意味着您的测试在将来的运行中不必等待外部 API 响应 - 将使用缓存的数据，从而实现更快、更可靠的测试。
动态修改：需要调整特定测试用例的响应？ playwright-network-cache 允许您动态修改缓存的响应。无论您想要更改状态代码、标头还是响应正文，该库都提供了即时调整缓存数据的选项，而无需手动维护单独的模拟。
灵活的结构：缓存系统根据主机名、请求方法和 URL 路径组织文件，确保您可以轻松浏览和管理缓存数据。对于更复杂的情况，您甚至可以通过请求查询参数、请求正文或其他自定义字段拆分缓存文件，确保数据存储和重用方式的完全灵活性。
速度提升：通过重用缓存的响应，您的测试不再需要等待网络调用完成，从而大大加快测试速度。当使用大型测试套件或在速度至关重要的 CI 环境中运行测试时，这特别有用。
不再有模拟地狱：忘记手动维护模拟。该库会为您处理一切 - 从缓存到重放，甚至修改响应。您不再需要为每个测试场景手动制作模拟响应，您可以更加关注测试逻辑。
无 HAR 复杂性：HAR 文件对于记录和重放网络交互非常有用，但它们很快就会变得很麻烦，尤其是当您需要修改响应时。 playwright-network-cache 提供了一种更干净、更灵活的 HAR 替代方案，让您可以将单个响应作为简单的 JSON 文件进行管理。
假设您正在测试一个从 API 获取猫列表的应用程序。如果没有缓存，每次测试运行都需要向 API 发出实时请求，从而为您的测试增加延迟和潜在的故障点。
使用 playwright-network-cache，您可以轻松缓存 API 响应：
test('test', async ({ page, cacheRoute }) => {
await cacheRoute.GET('https://example.com/api/cats');
// Perform usual test actions...
});
第一次运行时，响应被缓存在 .network-cache 目录中，其结构如下：
.network-cache
└── example.com
└── api-cats
└── GET
├── headers.json
└── body.json
On subsequent runs, the cached response is reused, making the test faster and eliminating the need to hit the actual API.
You can modify cached response for the particular test needs:
test('test', async ({ page, cacheRoute }) => {
await cacheRoute.GET('https://example.com/api/cats', {
modify: async (route, response) => {
const json = await response.json();
json[0].name = 'Kitty-1';
await route.fulfill({ json });
}
});
// Perform usual test actions...
});
To get cacheRoute variable available in your tests, instantiate it like any other Playwright fixture:
// fixtures.js
import { test as base } from '@playwright/test';
import { CacheRoute } from 'playwright-network-cache';
export const test = base.extend({
cacheRoute: async ({ page }, use) => {
const cacheRoute = new CacheRoute(page, { /* cache options */ });
await use(cacheRoute);
},
});
There are many other examples and use-cases in the library documentation.
playwright-network-cache isn’t just about caching. It offers advanced features like:
With these powerful capabilities, you can finely control how network requests are managed in your tests.
If you're looking to make your Playwright tests faster and more reliable, give a try to playwright-network-cache. By caching network responses on the filesystem and allowing for dynamic modifications, it eliminates the need for manual mocks and provides a flexible, easy-to-use alternative to HAR files.
Thanks for reading ❤️
以上是使用 Playwright-Network-Cache 增强您的 ETests的详细内容。更多信息请关注PHP中文网其他相关文章！
