Playwright初学指南 (1):环境配置与第一个自动化脚本

一、Playwright 简介与核心优势

Playwright 是微软开源的现代化 Web 自动化工具,支持 Chromium(Chrome/Edge)、Firefox、WebKit(Safari) 三大浏览器引擎,提供跨平台(Windows/macOS/Linux)和跨语言(Python/JS/Java/C#)的统一 API。其核心优势包括:

  • 智能等待机制:自动检测元素可交互性(如点击、输入),减少因网络延迟导致的测试失败 。

  • 录制与调试工具:内置 codegen 实时生成操作脚本,大幅降低学习成本 。

  • 真移动端模拟:内置设备描述符(如 iPhone 13),无需额外配置即可模拟手机环境 。

二、环境搭建(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/playwright
playwright install
2. 验证安装

运行以下脚本,成功输出浏览器标题即表示环境就绪:

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://playwright.dev")
    print("页面标题:", page.title())  # 应输出:Fast and reliable end-to-end testing
    browser.close()

✅ 成功标志:浏览器自动打开并显示 Playwright 官网,控制台打印正确标题 。

三、首个自动化脚本:网页导航与截图

脚本目标

访问 https://example.com,保存全页面截图并输出标题。

from playwright.sync_api import sync_playwright

def run():
    with sync_playwright() as p:
        # 启动浏览器并访问网页
        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())  # 输出:Example Domain
        
        browser.close()

if __name__ == "__main__":
    run()

效果说明

  1. 自动打开浏览器访问 example.com

  2. 生成全页截图 example.png

  3. 控制台输出标题 "Example Domain" 。

四、避坑指南与调试技巧

  1. 浏览器启动失败

    • 确保已执行 playwright install 安装浏览器内核。

    • 若报权限错误,尝试以管理员身份运行终端 。

  2. 截图不完整

    • 添加 full_page=True 参数捕获完整页面。

    • 使用 page.wait_for_load_state("networkidle") 确保资源加载完成 。

  3. 调试神器

    • 脚本录制playwright codegen https://example.com 操作浏览器自动生成代码,适合快速原型设计 。

    • 执行追踪:通过 Trace Viewer 回放操作过程(含网络请求与DOM快照):
      context = browser.new_context()
      context.tracing.start(screenshots=True, snapshots=True)
      # ...执行操作...
      context.tracing.stop(path="trace.zip")
      # 查看日志:npx playwright show-trace trace.zip
      

五、同步 vs 异步模式选择

模式适用场景代码示例
同步

简单脚本/快速调试

from playwright.sync_api import ...
异步

高并发任务/爬虫

await page.goto(...)
异步示例

(爬虫效率提升3倍+):

import asyncio
from playwright.async_api import async_playwright

async def main():
    async with async_playwright() as p:
        browser = await p.chromium.launch()
        page = await browser.new_page()
        await page.goto("https://example.com")
        await page.screenshot(path="async_example.png")
        await browser.close()

asyncio.run(main())

六、总结与下一步

1 小时成果清单

  • ✅ 完成跨平台环境搭建

  • ✅ 首个导航+截图脚本

  • ✅ 掌握同步/异步模式选择

  • ✅ 学会使用录制与调试工具

下一步学习
➡️ 元素定位进阶:文本/CSS/XPath/语义化定位实战
➡️ 框架集成:用 Pytest 管理测试用例
➡️ CI/CD 流水线:GitHub Actions 自动执行测试 。

立即行动:10分钟内生成你的第一个自动化脚本!

引用说明:本文环境搭建步骤参考 Playwright 官方文档及国内开发者实践指南,代码示例经实测验证可稳定运行。

敬请期待下一步的学习!!!



推荐阅读
从零开始打造AI测试平台:文档解析与知识库构建详解
国产模型Qwen3-32B本地化实战:LangChain + vLLM 构建企业智能引擎
深入解析Agent实现“听懂→规划→执行”全流程的奥秘

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值