跳至主要内容

模拟 API

简介

Web API 通常作为 HTTP 端点实现。Playwright 提供 API 来 **模拟** 和 **修改** 网络流量,包括 HTTP 和 HTTPS。页面进行的任何请求,包括 XHRfetch 请求,都可以被跟踪、修改和模拟。使用 Playwright,您还可以使用包含页面发出的多个网络请求的 HAR 文件进行模拟。

模拟 API 请求

以下代码将拦截对 */**/api/v1/fruits 的所有调用,并返回自定义响应。不会向 API 发出任何请求。测试将转到使用模拟路由的 URL,并断言页面上存在模拟数据。

// Intercept the route to the fruit API
await page.RouteAsync("*/**/api/v1/fruits", async route => {
var json = new[] { new { name = "Strawberry", id = 21 } };
// fulfill the route with the mock data
await route.FulfillAsync(new()
{
Json = json
});
});

// Go to the page
await page.GotoAsync("https://demo.playwright.dev/api-mocking");

// Assert that the Strawberry fruit is visible
await Expect(page.GetByTextAsync("Strawberry")).ToBeVisibleAsync();

您可以从示例测试的追踪中看到,API 从未被调用,但它已使用模拟数据完成。 api 模拟追踪

了解更多关于 高级网络

修改 API 响应

有时,发出 API 请求是必要的,但需要修补响应以允许可重复的测试。在这种情况下,与其模拟请求,不如执行请求并使用修改后的响应来完成它。

在下面的示例中,我们拦截了对水果 API 的调用,并在数据中添加了一个名为“Loquat”的新水果。然后,我们转到 URL 并断言此数据存在。

await page.RouteAsync("*/**/api/v1/fruits", async (route) => {
var response = await route.FetchAsync();
var fruits = await response.JsonAsync<Fruit[]>();
fruits.Add(new Fruit() { Name = "Loquat", Id = 100 });
// Fulfill using the original response, while patching the response body
// with the given JSON object.
await route.FulfillAsync(new ()
{
Response = response,
Json = fruits
});
}
);
// Go to the page
await page.GotoAsync("https://demo.playwright.dev/api-mocking");

// Assert that the Loquat fruit is visible
await Expect(page.GetByTextAsync("Loquat", new () { Exact = true })).ToBeVisibleAsync();

在我们的测试追踪中,我们可以看到 API 被调用,并且响应被修改。 显示 API 被调用并完成的测试追踪

通过检查响应,我们可以看到我们的新水果已添加到列表中。 显示模拟响应的测试追踪

了解更多关于 高级网络

使用 HAR 文件模拟

HAR 文件是一个 HTTP 存档 文件,其中包含加载页面时发出的所有网络请求的记录。它包含有关请求和响应标头、cookie、内容、计时等的信息。您可以使用 HAR 文件来模拟测试中的网络请求。您需要

  1. 录制 HAR 文件。
  2. 将 HAR 文件与测试一起提交。
  3. 使用测试中保存的 HAR 文件路由请求。

录制 HAR 文件

为了录制 HAR 文件,我们使用 Page.RouteFromHARAsync()BrowserContext.RouteFromHARAsync() 方法。此方法接受 HAR 文件的路径和可选的选项对象。选项对象可以包含 URL,以便仅使用与指定 glob 模式匹配的 URL 的请求将从 HAR 文件提供。如果没有指定,则所有请求都将从 HAR 文件提供。

update 选项设置为 true 将使用实际网络信息创建或更新 HAR 文件,而不是从 HAR 文件提供请求。在创建测试以使用真实数据填充 HAR 时使用它。

// Get the response from the HAR file
await page.RouteFromHARAsync("./hars/fruit.har", new () {
Url = "*/**/api/v1/fruits",
Update = true,
});

// Go to the page
await page.GotoAsync("https://demo.playwright.dev/api-mocking");

// Assert that the fruit is visible
await Expect(page.GetByText("Strawberry")).ToBeVisibleAsync();

修改 HAR 文件

录制 HAR 文件后,可以通过打开“hars”文件夹中的哈希 .txt 文件并编辑 JSON 来修改它。此文件应该提交到您的源代码管理中。只要使用 update: true 运行此测试,它就会使用 API 中的请求更新您的 HAR 文件。

[
{
"name": "Playwright",
"id": 100
},
// ... other fruits
]

从 HAR 重播

现在您已经录制并修改了 HAR 文件中的模拟数据,它可以用来在测试中提供匹配的响应。为此,只需关闭或简单地删除 update 选项。这将使用 HAR 文件运行测试,而不是访问 API。

// Replay API requests from HAR.
// Either use a matching response from the HAR,
// or abort the request if nothing matches.
await page.RouteFromHARAsync("./hars/fruit.har", new ()
{
Url = "*/**/api/v1/fruits",
Update = false,
}
);

// Go to the page
await page.GotoAsync("https://demo.playwright.dev/api-mocking");

// Assert that the Playwright fruit is visible
await page.ExpectByTextAsync("Playwright", new() { Exact = true }).ToBeVisibleAsync();

在我们的测试追踪中,我们可以看到路由是从 HAR 文件完成的,并且没有调用 API。 显示使用 HAR 文件的追踪

如果我们检查响应,我们可以看到我们的新水果已添加到 JSON 中,这是通过手动更新 hars 文件夹中的哈希 .txt 文件完成的。 显示来自 HAR 文件的响应的追踪

HAR 重播严格匹配 URL 和 HTTP 方法。对于 POST 请求,它也严格匹配 POST 负载。如果多个记录匹配请求,则选择标头匹配最多的那个。导致重定向的条目将自动跟随。

与录制类似,如果给定的 HAR 文件名以 .zip 结尾,则它被视为一个包含 HAR 文件的存档,以及作为单独条目存储的网络负载。您也可以解压缩此存档,手动编辑负载或 HAR 日志,然后指向解压缩的 har 文件。所有负载将在文件系统上相对于解压缩的 har 文件解析。

使用 CLI 录制 HAR

我们建议使用 update 选项为您的测试录制 HAR 文件。但是,您也可以使用 Playwright CLI 录制 HAR。

使用 Playwright CLI 打开浏览器,并传递 --save-har 选项以生成 HAR 文件。可选地,使用 --save-har-glob 仅保存您感兴趣的请求,例如 API 端点。如果 har 文件名以 .zip 结尾,则工件将作为单独的文件写入,并将全部压缩到单个 zip 中。

# Save API requests from example.com as "example.har" archive.
pwsh bin/Debug/netX/playwright.ps1 open --save-har=example.har --save-har-glob="**/api/**" https://example.com

了解更多关于 高级网络

模拟 WebSockets

以下代码将拦截 WebSocket 连接,并模拟整个 WebSocket 上的通信,而不是连接到服务器。此示例使用 "response" 响应 "request"

await page.RouteWebSocketAsync("wss://example.com/ws", ws => {
ws.OnMessage(message => {
if (message == "request")
ws.Send("response");
});
});

或者,您可能希望连接到实际的服务器,但拦截中间的消息,并修改或阻止它们。以下是一个修改页面发送到服务器的一些消息,而其他消息保持不变的示例。

await page.RouteWebSocketAsync("wss://example.com/ws", ws => {
var server = ws.ConnectToServer();
ws.OnMessage(message => {
if (message == "request")
server.Send("request2");
else
server.Send(message);
});
});

有关更多详细信息,请参阅 WebSocketRoute