一、Playwright 简介与中枢上风开yun体育网

Playwright 是微软开源的当代化 Web 自动化用具，复古 Chromium（Chrome/Edge）、Firefox、WebKit（Safari） 三大浏览器引擎，提供跨平台（Windows/macOS/Linux）和跨说念话（Python/JS/Java/C#）的长入 API。

中枢上风：✅ 自动恭候机制：智能恭候元素加载，减少因收罗延长导致的失败✅ 录制与调试用具：内置 codegen 及时生成操作剧本✅ 多说念话复古：Python/Node.js/Java/C# 机动领受✅ 真出动端模拟：内置树立神色符（如 iPhone 13/Pixel 5）

二、环境搭建（10分钟科罚！）

1. 装置 Python 环境（需 3.8+）

# 查验 Python 版块python --version# 装置 Playwright 库pip install playwright# 装置浏览器驱动（自动下载 Chromium/Firefox/WebKit）playwright install

避坑教唆：国内用户可通过竖立镜像加快下载：

set PLAYWRIGHT_DOWNLOAD_HOST=https://npmmirror.com/mirrors/playwrightplaywright install

2. 考据装置

from playwright.sync_api import sync_playwrightwith sync_playwright() as p: browser = p.chromium.launch(headless=False) # 袒露浏览器界面 page = browser.new_page() page.goto("https://playwright.dev") print(page.title()) # 输出：Fast and reliable end-to-end testing browser.close()

初始告捷即暗意环境就绪 ✅

三、首个测试剧本：网页导航与截图（15分钟）

from playwright.sync_api import sync_playwrightdefrun():with sync_playwright() as p:# 启动 Chromium 并窥察网页 browser = p.chromium.launch(headless=False) page = browser.new_page() page.goto("https://example.com")# 保存截图（含竣工页面） page.screenshot(path="example.png", full_page=True)# 打印页面标题 print("页面标题:", page.title()) browser.close()if __name__ == "__main__": run()

效果讲明：

自动翻开浏览器并窥察 example.com生周到页截图 example.png斥逐台输出标题 "Example Domain"

四、进阶操作：元素定位与交互（20分钟）

1. 元素定位四大情势

# 文本定位（推选！）page.locator("text='登录'").click()# CSS 领受器page.locator("#submit-btn").click()# XPathpage.locator("//button[@class='confirm']").click()# 语义化定位（ARIA 变装）page.get_by_role("button", name="提交").click()

最好履行：优先使用 text 或 get_by_role() 提高可读性和自如性。

2. 模拟用户登录经过

# 输入用户名密码page.get_by_placeholder("请输动手机号/邮箱").fill("test@example.com")page.get_by_placeholder("请输入密码").fill("mypassword")# 点击登录按钮page.get_by_role("button", name="登录").click()# 恭候导航完成page.wait_for_url("**/dashboard")

注：wait_for_url() 确保页面跳转完成再络续操作。

五、调试神器：录制用具与 Trace Viewer

1. 剧本录制（codegen）

# 启动录制器（自动生成 Python 代码）playwright codegen https://example.com

操作浏览器界面即可及时生成代码，合适快速原型诡计：!https://example.com/codegen-demo.png

教唆：录制后需优化定位器逻辑。

2. 跟踪测试过程（Trace Viewer）

context = browser.new_context()context.tracing.start(screenshots=True, snapshots=True) # 开启记载# ...践诺操作...context.tracing.stop(path="trace.zip") # 保存日记

检察日记：

npx playwright show-trace trace.zip

可回放操作视频、检察 DOM 快照及收罗申请。

六、同步 vs 异步模式领受

异步示例：

import asynciofrom playwright.async_api import async_playwrightasyncdefmain():asyncwith async_playwright() as p: browser = await p.chromium.launch() page = await browser.new_page()await page.goto("https://example.com")await browser.close()asyncio.run(main())

教唆：爬虫或批量操作时异步遵循普及 3 倍+。

七、实战案例：爬取商品数据

asyncdefscrape_products():asyncwith async_playwright() as p: browser = await p.chromium.launch() page = await browser.new_page()await page.goto("https://shop.example.com")# 赢得通盘商品标题 titles = await page.eval_on_selector_all(".product-item", "elements => elements.map(e => e.textContent)" ) print(titles) # 输出：['商品A', '商品B', ...]await browser.close()

要津点：eval_on_selector_all() 径直践诺 JS 索求数据。

八、归来与学习旅途

1 小时遵循清单：

✅ 环境搭建与浏览器驱动装置✅ 首个导航+截图剧本✅ 元素定位与表单操作✅ 剧本录制与 Trace 调试

下一步学习：

➡️ 框架集成：邻接 Pytest 料理测试用例➡️ 出动端测试：p.devices["iPhone 13"] 模拟真机➡️ CI/CD 活水线：GitHub Actions 自动践诺测试

官方资源：https://playwright.dev/pythonhttps://github.com/microsoft/playwright-python

掌抓基础操作后开yun体育网，你已具备用 Playwright 罢了 自动化测试、数据集聚、监控任务 的才气！