Playwright UI自动化实战速成指南

如果你也厌倦了Selenium里没完没了的等待、动不动就失效的选择器，还有各种浏览器兼容的坑，那Playwright绝对是你的救星。用它写脚本不仅跑得快，写起来也更舒心。下面就用实际代码，带你看看Playwright的四个提速绝招。

一、 为何选择Playwright？速度与智能的融合

Playwright不是一个简单的Selenium替代品，它是一个为现代Web应用量身定制的自动化核武器。其核心优势在于：

• 跨浏览器王者：原生支持Chromium、Firefox和WebKit（Safari），确保你的应用在所有核心引擎上表现一致。

• 自动等待智能：内置智能等待机制，自动等待元素可操作、网络请求完成，彻底告别time.sleep()和不可靠的隐式等待。

• 多上下文隔离：轻松模拟多标签页、多用户场景，互不干扰。

• 强大的选择器引擎：支持文本选择、React/Vue组件选择等，编写选择器更直观、更健壮。

• 网络拦截与Mock：直接拦截和修改网络请求，无需修改生产代码即可测试各种场景。

二、 极速起飞：四大实战提速秘籍

让我们通过代码来看看Playwright如何解决传统自动化中的痛点。

秘籍一：智能等待（Auto-waiting） - 告别time.sleep

传统脚本需要手动添加等待，否则元素未加载就会报错。Playwright的几乎所有操作（如click, fill）都内置了智能等待。

# ✅ Playwright 方式 (正确)
from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch(headless=False)
    page = browser.new_page()
    page.goto("https://demoqa.com/login")
    
    # 以下操作会自动等待元素出现、可见、可操作（如未被遮挡、可点击）
    page.fill("#userName", "testuser") # 自动等待输入框
    page.fill("#password", "Password123")
    page.click("#login") # 自动等待按钮可点击
    
    # 无需手动等待页面跳转，可直接断言新页面的元素
    assert page.is_visible("text=Profile") # 等待并断言“Profile”文本出现
    browser.close()

# ❌ 传统方式 (错误示范)
# from selenium import webdriver
# from selenium.webdriver.common.by import By
# from selenium.webdriver.support.ui import WebDriverWait
# ... 需要大量 try-catch 和显式等待，代码冗长易失败

秘籍二：无敌选择器（Powerful Selectors） - 精准定位元素

Playwright的选择器引擎极其强大，支持CSS、文本内容、甚至XPath和自定义引擎组合。

# 1. 文本选择器 - 点击文本为"Login"的按钮
page.click("text=Login")

# 2. CSS选择器 + 文本组合 - 选择class为`btn`且文本为`Submit`的按钮
page.click(".btn:has-text('Submit')")

# 3. React/Vue组件选择器 (需配合playwright实验性功能)
# page.click("_react=SubmitButton[value='OK']")
# page.click("_vue=my-component[value='OK']")

# 4. 选择第N个元素
page.click("li >