模拟
简介
使用Playwright,您可以在任何浏览器上测试您的应用程序,并模拟真实设备如手机或平板电脑。只需配置您想要模拟的设备,Playwright就会模拟浏览器行为,例如"userAgent"
、"screenSize"
、"viewport"
以及是否启用"hasTouch"
。您还可以为所有测试或特定测试模拟"geolocation"
、"locale"
和"timezone"
,以及设置"permissions"
来显示通知或更改"colorScheme"
。
设备
Playwright 提供了一个设备参数注册表,使用playwright.devices来模拟选定的桌面、平板和移动设备。它可以用来模拟特定设备的浏览器行为,如用户代理、屏幕尺寸、视口以及是否启用触摸功能。所有测试都将在指定的设备参数下运行。
- Sync
- 异步
from playwright.sync_api import sync_playwright, Playwright
def run(playwright: Playwright):
iphone_13 = playwright.devices['iPhone 13']
browser = playwright.webkit.launch(headless=False)
context = browser.new_context(
**iphone_13,
)
with sync_playwright() as playwright:
run(playwright)
import asyncio
from playwright.async_api import async_playwright, Playwright
async def run(playwright: Playwright):
iphone_13 = playwright.devices['iPhone 13']
browser = await playwright.webkit.launch(headless=False)
context = await browser.new_context(
**iphone_13,
)
async def main():
async with async_playwright() as playwright:
await run(playwright)
asyncio.run(main())

视口
视口包含在设备中,但您可以通过page.set_viewport_size()为某些测试覆盖它。
测试文件:
同样的功能在测试文件中也适用。
- Sync
- 异步
# Create context with given viewport
context = browser.new_context(
viewport={ 'width': 1280, 'height': 1024 }
)
# Resize viewport for individual page
page.set_viewport_size({"width": 1600, "height": 1200})
# Emulate high-DPI
context = browser.new_context(
viewport={ 'width': 2560, 'height': 1440 },
device_scale_factor=2,
)
# Create context with given viewport
context = await browser.new_context(
viewport={ 'width': 1280, 'height': 1024 }
)
# Resize viewport for individual page
await page.set_viewport_size({"width": 1600, "height": 1200})
# Emulate high-DPI
context = await browser.new_context(
viewport={ 'width': 2560, 'height': 1440 },
device_scale_factor=2,
)
isMobile
是否考虑元视口标签并启用了触摸事件。
- Sync
- 异步
context = browser.new_context(
isMobile=false
)
context = await browser.new_context(
isMobile=false
)
区域设置与时区
模拟用户区域设置和时区,这些可以在配置中为所有测试全局设置,然后针对特定测试进行覆盖。
- Sync
- 异步
context = browser.new_context(
locale='de-DE',
timezone_id='Europe/Berlin',
)
context = await browser.new_context(
locale='de-DE',
timezone_id='Europe/Berlin',
)

权限
允许应用显示系统通知。
- Sync
- 异步
context = browser.new_context(
permissions=['notifications'],
)
context = await browser.new_context(
permissions=['notifications'],
)
允许特定域的通知。
- Sync
- 异步
context.grant_permissions(['notifications'], origin='https://skype.com')
await context.grant_permissions(['notifications'], origin='https://skype.com')
使用browser_context.clear_permissions()撤销所有权限。
- Sync
- 异步
context.clear_permissions()
await context.clear_permissions()
地理位置
授予 "geolocation"
权限并将地理位置设置为特定区域。
- Sync
- 异步
context = browser.new_context(
geolocation={"longitude": 41.890221, "latitude": 12.492348},
permissions=["geolocation"]
)
context = await browser.new_context(
geolocation={"longitude": 41.890221, "latitude": 12.492348},
permissions=["geolocation"]
)

稍后更改位置:
- Sync
- 异步
context.set_geolocation({"longitude": 48.858455, "latitude": 2.294474})
await context.set_geolocation({"longitude": 48.858455, "latitude": 2.294474})
注意 你只能更改上下文中所有页面的地理位置。
配色方案与媒体
模拟用户的"colorScheme"
。支持的值为'light'和'dark'。您还可以通过page.emulate_media()来模拟媒体类型。
- Sync
- 异步
# Create context with dark mode
context = browser.new_context(
color_scheme='dark' # or 'light'
)
# Create page with dark mode
page = browser.new_page(
color_scheme='dark' # or 'light'
)
# Change color scheme for the page
page.emulate_media(color_scheme='dark')
# Change media for page
page.emulate_media(media='print')
# Create context with dark mode
context = await browser.new_context(
color_scheme='dark' # or 'light'
)
# Create page with dark mode
page = await browser.new_page(
color_scheme='dark' # or 'light'
)
# Change color scheme for the page
await page.emulate_media(color_scheme='dark')
# Change media for page
await page.emulate_media(media='print')

用户代理
用户代理(User Agent)已包含在设备中,因此您很少需要更改它。但如果您确实需要测试不同的用户代理,可以使用userAgent
属性来覆盖它。
- Sync
- 异步
context = browser.new_context(
user_agent='My user agent'
)
context = await browser.new_context(
user_agent='My user agent'
)
离线
模拟网络处于离线状态。
- Sync
- 异步
context = browser.new_context(
offline=True
)
context = await browser.new_context(
offline=True
)
启用JavaScript
模拟用户禁用JavaScript的场景。
- Sync
- 异步
context = browser.new_context(
java_script_enabled=False
)
context = await browser.new_context(
java_script_enabled=False
)