用途
该技能用于借助 Playwright 的设备模拟能力，测试响应式设计与移动端特有功能。适用于测试移动布局、触摸交互、设备特定功能或响应式断点等场景。
主要能力
- 设备模拟：通过
devices对象使用预置设备（如 iPhone 14、Pixel 7、iPad Pro 11、Galaxy S III 等），也可自定义视口、User-Agent、deviceScaleFactor、isMobile、hasTouch、defaultBrowserType 等参数。 - 项目级设备配置：在
playwright.config.ts中按项目分别配置桌面浏览器、移动设备与平板设备。 - 响应式断点测试：遍历多个视口尺寸（如 375×667、768×1024、1280×720、1920×1080），对每个断点执行截图断言。
- 动态视口变化：在单个测试中切换视口尺寸，验证桌面导航、平板汉堡菜单、移动端菜单按钮的显隐变化。
- 触摸交互：支持 tap 点击、滑动（swipe）、长按（long press）等手势模拟；资料指出多点触控捏合缩放需要自定义实现。
- 屏幕方向测试：通过切换视口宽高模拟竖屏与横屏，或直接使用带 landscape 后缀的设备变体。
- 地理位置模拟：设置经纬度与 geolocation 权限，并可在测试过程中通过
context.setGeolocation动态更改位置。 - 网络条件模拟：通过 CDP 模拟慢速 3G（下载/上传吞吐量、延迟），以及使用
context.setOffline(true)测试离线模式。 - 设备特有功能：测试刘海/安全区域（safe area inset）、深色模式（colorScheme: 'dark'）、减少动画（reducedMotion: 'reduce'）。
- 跨设备视觉回归：对多个设备分别执行截图断言，生成按设备命名的截图文件。
使用方式
在测试文件中从 @playwright/test 导入 test, expect, devices，通过 test.use(devices['iPhone 14']) 应用设备配置，或在配置文件中按项目设置。触摸操作使用 tap()、鼠标事件组合模拟滑动与长按。网络模拟使用 context.newCDPSession(page) 发送 Network.emulateNetworkConditions。
适用场景
- 移动端布局与响应式断点验证
- 触摸手势与移动导航测试
- 屏幕方向切换测试
- 地理位置相关功能测试
- 弱网与离线场景测试
- 跨设备视觉回归测试
限制
资料明确说明：模拟虽好但不完美，建议同时测试真实设备；多点触控捏合缩放需要自定义实现；部分设备（如 Galaxy S23）在示例中使用最接近的可用设备（Galaxy S III）替代。