子月二二1. 为什么从Selenium转向Playwright？
作为一名长期使用Selenium进行UI自动化测试的开发者，我最近完成了从Selenium到Playwright的全面迁移。这次迁移源于一个实际需求：我们需要构建一个高可靠性的UI监控工具，用于持续检测关键业务页面的可用性和功能完整性。
Selenium作为老牌自动化测试工具，确实有着广泛的社区支持和成熟的生态系统。但在实际使用中，我们遇到了几个痛点：
- 测试执行速度慢，特别是在复杂页面上
- 对动态内容的处理不够稳定
- 跨浏览器测试配置复杂
- 需要额外依赖WebDriver
Playwright作为微软推出的新一代自动化测试工具，完美解决了这些问题。它内置了对Chromium、WebKit和Firefox的支持，无需额外配置WebDriver；提供了更强大的页面操作API；最重要的是，执行速度比Selenium快2-3倍。
需要模型API调用？ 免费领10W Token，多模型网关一键接入 Claude、DeepSeek 等主流模型。
2. 迁移前的准备工作
2.1 环境对比与选型分析
在决定迁移前，我们进行了详细的工具对比：
| 特性 | Selenium | Playwright |
|---|---|---|
| 浏览器支持 | 需单独配置WebDriver | 内置三大浏览器引擎 |
| 执行速度 | 较慢 | 快2-3倍 |
| 动态内容处理 | 需要显式等待 | 自动等待元素就绪 |
| 跨浏览器测试 | 配置复杂 | 一行代码切换 |
| 移动端模拟 | 有限支持 | 完整设备模拟 |
| 录制功能 | 需要插件 | 内置codegen |
2.2 依赖管理与环境搭建
Playwright支持多种语言绑定，我们选择Python版本进行迁移。安装非常简单：
bash复制pip install playwright
playwright install
与Selenium不同，Playwright会自动下载所需的浏览器二进制文件，无需单独管理WebDriver。这大大简化了环境配置，特别是在CI/CD流水线中。
提示：在生产环境中，建议固定Playwright版本以避免自动更新带来的意外变化。
3. 核心API迁移指南
3.1 浏览器启动与页面导航
Selenium中的浏览器启动和页面导航代码：
python复制from selenium import webdriver
driver = webdriver.Chrome()
driver.get("https://example.com")
对应的Playwright实现：
python复制from playwright.sync_api import sync_playwright
with sync_playwright() as p:
browser = p.chromium.launch()
page = browser.new_page()
page.goto("https://example.com")
关键改进：
- 自动管理浏览器生命周期（通过上下文管理器）
- 支持无头模式（headless=False）
- 内置页面对象模型，API更简洁
3.2 元素定位与操作
Selenium的元素定位：
python复制element = driver.find_element(By.CSS_SELECTOR, "#submit-btn")
element.click()
Playwright的改进版本：
python复制page.click("#submit-btn")
或者更精确的定位方式：
python复制page.locator("button:has-text('Submit')").click()
Playwright提供了更丰富的定位策略：
- 文本内容定位（:has-text()）
- 元素关系定位（:right-of, :near等）
- 自动等待元素可操作状态
3.3 等待机制对比
Selenium中需要显式等待：
python复制from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
element = WebDriverWait(driver, 10).until(
EC.presence_of_element_located((By.ID, "dynamic-element"))
)
Playwright内置智能等待：
python复制element = page.locator("#dynamic-element").first
element.wait_for()
或者更简洁的：
python复制page.click("#dynamic-element")
Playwright的所有操作都会自动等待元素可达、可见且可操作，大幅减少了flaky测试。
4. 构建UI监控工具实战
4.1 监控场景设计
我们的UI监控工具需要实现以下功能：
- 定期检查关键页面的可访问性
- 验证核心业务流程（如登录、下单）
- 截图记录异常状态
- 生成可读性强的报告
4.2 核心监控逻辑实现
python复制from playwright.sync_api import sync_playwright
import time
def monitor_website(url, actions=None, check_interval=3600):
while True:
with sync_playwright() as p:
browser = p.chromium.launch(headless=True)
context = browser.new_context()
page = context.new_page()
try:
# 访问目标页面
response = page.goto(url)
if not response.ok:
raise Exception(f"Page load failed: {response.status}")
# 执行自定义监控动作
if actions:
for action in actions:
action(page)
# 健康检查通过
print(f"[{time.ctime()}] {url} - OK")
except Exception as e:
# 捕获异常并截图
timestamp = time.strftime("%Y%m%d_%H%M%S")
screenshot_path = f"error_{timestamp}.png"
page.screenshot(path=screenshot_path)
print(f"[{time.ctime()}] {url} - ERROR: {str(e)}")
finally:
context.close()
browser.close()
time.sleep(check_interval)
4.3 高级监控功能扩展
4.3.1 性能指标采集
Playwright可以轻松获取页面性能数据：
python复制# 获取加载性能指标
metrics = page.metrics()
print(f"DOMContentLoaded: {metrics['domContentLoaded']}ms")
print(f"Load: {metrics['load']}ms")
# 获取资源加载时间
timing = page.evaluate("JSON.stringify(window.performance.timing)")
print(timing)
4.3.2 网络请求监控
python复制# 监听网络请求
def log_request(request):
print(f"> {request.method} {request.url}")
page.on("request", log_request)
# 监听响应
def log_response(response):
if not response.ok:
print(f"< {response.status} {response.url}")
page.on("response", log_response)
4.3.3 视觉回归测试
python复制# 截屏并比较
expect(page).to_have_screenshot("homepage.png")
5. 迁移过程中的经验与坑
5.1 常见问题解决方案
-
元素定位失败：
- Selenium的定位器可能不完全适用于Playwright
- 解决方案：使用Playwright的文本定位或关系定位
- 示例：
page.locator("button:has-text('Submit')")
-
iframe处理：
- Playwright处理iframe更简单直接
- 示例：
python复制frame = page.frame(name="iframe-name") frame.click("#button-in-iframe")
-
文件下载：
- Playwright有专门的下载API
- 示例：
python复制with page.expect_download() as download_info: page.click("#download-button") download = download_info.value path = download.path()
5.2 性能优化技巧
-
复用浏览器上下文：
python复制# 创建时可配置代理、视口等 context = browser.new_context( viewport={"width": 1920, "height": 1080}, locale="en-US" ) # 多个测试可以复用同一个context -
并行执行：
Playwright原生支持并行测试，相比Selenium Grid更轻量。 -
选择性截图：
python复制# 只截取特定元素 page.locator("#important-section").screenshot(path="section.png")
5.3 调试技巧
-
Playwright Inspector：
启动时添加headless=False和devtools=True参数，可以打开浏览器开发者工具。 -
录制脚本：
bash复制
playwright codegen https://example.com这个命令会启动一个交互式浏览器，并实时生成操作对应的代码。
-
慢动作模式：
python复制browser = p.chromium.launch(headless=False, slow_mo=100) # 每个操作延迟100ms
6. 监控工具的高级应用
6.1 分布式监控架构
对于大规模监控需求，我们可以构建分布式架构：
code复制[调度中心] -> [多个监控节点] -> [存储与分析系统] -> [报警系统]
使用Playwright的轻量级特性，每个监控节点可以运行多个浏览器实例。
6.2 与现有系统集成
-
报警集成：
python复制def send_alert(message): # 集成企业微信、钉钉或邮件报警 pass try: # 监控逻辑 except Exception as e: send_alert(f"监控异常: {str(e)}") -
数据存储：
python复制def save_result(url, status, metrics): # 存储到数据库或时间序列数据库 pass -
可视化展示：
将监控数据接入Grafana等可视化工具，构建监控仪表盘。
6.3 移动端监控
Playwright支持完整的移动端模拟：
python复制iphone = p.devices["iPhone 12"]
browser = p.chromium.launch()
context = browser.new_context(**iphone)
page = context.new_page()
可以监控移动端页面的响应性和功能完整性。
7. 实际效果对比
迁移完成后，我们的UI监控工具在以下方面有明显提升：
| 指标 | Selenium实现 | Playwright实现 | 改进幅度 |
|---|---|---|---|
| 执行速度 | 120秒 | 45秒 | 62.5%↑ |
| 稳定性 | 85% | 98% | 13%↑ |
| 资源占用 | 高 | 低 | 显著降低 |
| 维护成本 | 高 | 低 | 显著降低 |
| 功能覆盖 | 基础 | 全面 | 扩展性强 |
特别是在动态内容丰富的页面上，Playwright的稳定性优势更加明显。以前需要大量显式等待的测试用例，现在可以更简洁地实现，且失败率大幅降低。
8. 迁移决策建议
根据我们的迁移经验，以下情况建议考虑从Selenium迁移到Playwright：
-
新项目启动：毫无疑问选择Playwright，更现代的API和更好的性能
-
现有Selenium项目：
- 如果项目稳定且维护成本可接受，可以暂不迁移
- 如果遇到稳定性或性能问题，建议逐步迁移
- 新功能优先使用Playwright实现
-
需要高级功能：
- 移动端测试
- 网络请求拦截和模拟
- 视觉回归测试
- 性能监控
迁移过程可以分阶段进行，先从辅助性的监控任务开始，逐步替换核心测试用例。Playwright也提供了与现有测试框架（如pytest）的良好集成，可以平滑过渡。