模拟

简介

使用 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'、'no-preference'。您也可以使用 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 });