模拟

简介

使用 Playwright，您可以在任何浏览器上测试您的应用程序，并模拟真实设备，例如手机或平板电脑。 只需配置您想要模拟的设备，Playwright 将模拟浏览器行为，例如 "userAgent"、"screenSize"、"viewport" 以及是否启用 "hasTouch"。 您还可以为所有测试或特定测试模拟 "geolocation"、"locale" 和 "timezone"，以及设置 "permissions" 以显示通知或更改 "colorScheme"。

设备

Playwright 附带一个设备参数注册表，使用 Playwright.Devices 用于选定的桌面、平板电脑和移动设备。 它可以用于模拟特定设备的浏览器行为，例如用户代理、屏幕尺寸、视口以及是否启用触摸。 所有测试都将使用指定的设备参数运行。

using Microsoft.Playwright;
using System.Threading.Tasks;

using var playwright = await Playwright.CreateAsync();
await using var browser = await playwright.Chromium.LaunchAsync(new()
{
    Headless = false
});
var iphone13 = playwright.Devices["iPhone 13"];
await using var context = await browser.NewContextAsync(iphone13);

视口

视口包含在设备中，但您可以使用 Page.SetViewportSizeAsync() 为某些测试覆盖它。

测试文件

在测试文件中也适用。

// Create context with given viewport
await using var context = await browser.NewContextAsync(new()
{
    ViewportSize = new ViewportSize() { Width = 1280, Height = 1024 }
});

// Resize viewport for individual page
await page.SetViewportSizeAsync(1600, 1200);

// Emulate high-DPI
await using var context = await browser.NewContextAsync(new()
{
    ViewportSize = new ViewportSize() { Width = 2560, Height = 1440 },
    DeviceScaleFactor = 2
});

isMobile

是否考虑元视口标记并启用触摸事件。

await using var context = await browser.NewContextAsync(new()
{
    IsMobile = false
});

区域设置 & 时区

模拟用户区域设置和时区，可以在配置中全局设置为所有测试，然后为特定测试覆盖。

await using var context = await browser.NewContextAsync(new()
{
    Locale = "de-DE",
    TimezoneId = "Europe/Berlin"
});

权限

允许应用程序显示系统通知。

允许特定域的通知。

await context.GrantPermissionsAsync(new[] { "notifications" }, origin: "https://skype.com");

使用 BrowserContext.ClearPermissionsAsync() 撤销所有权限。

await context.ClearPermissionsAsync();

地理位置

授予 "geolocation" 权限并将地理位置设置为特定区域。

await using var context = await browser.NewContextAsync(new()
{
    Permissions = new[] { "geolocation" },
    Geolocation = new Geolocation() { Longitude = 41.890221, Latitude = 12.492348 }
});

稍后更改位置

await context.SetGeolocationAsync(new Geolocation() { Longitude = 48.858455, Latitude = 2.294474 });

注意 您只能更改上下文中所有页面的地理位置。

颜色方案和媒体

模拟用户的 "colorScheme"。 支持的值为“light”和“dark”。 您还可以使用 Page.EmulateMediaAsync() 模拟媒体类型。

// Create context with dark mode
await using var context = await browser.NewContextAsync(new()
{
    ColorScheme = ColorScheme.Dark
});

// Create page with dark mode
var page = await browser.NewPageAsync(new()
{
    ColorScheme = ColorScheme.Dark
});

// Change color scheme for the page
await page.EmulateMediaAsync(new()
{
    ColorScheme = ColorScheme.Dark
});

// Change media for page
await page.EmulateMediaAsync(new()
{
    Media = Media.Print
});

用户代理

用户代理包含在设备中，因此您很少需要更改它，但是如果您确实需要测试不同的用户代理，您可以使用 userAgent 属性覆盖它。

var context = await browser.NewContextAsync(new() { UserAgent = "My User Agent" });

离线

模拟网络离线。

var context = await browser.NewContextAsync(new() { Offline = true });

启用 JavaScript

模拟 JavaScript 被禁用的用户场景。

var context = await browser.NewContextAsync(new() { JavaScriptEnabled = false });