> 技术文档 > Playwright 快速实现网页自动化脚本录制与执行(附完整 Python 示例)_playwright录制脚本

Playwright 快速实现网页自动化脚本录制与执行(附完整 Python 示例)_playwright录制脚本


一、安装与准备

在开始之前,请确保你已经完成了 Playwright 的安装。如果未安装,可按如下命令进行安装:

pip install playwright playwright install

安装完成后,即可使用 playwright codegen 进行录制和调试。


二、启动 Playwright 并调试页面

Playwright 提供了录制工具,可以边操作网页边自动生成代码。

我们先用命令启动录制模式:

使用命令行启动

playwright codegen --viewport-size=1920,1080 https****** //将窗口大小设置为 1920×1080

这条命令将打开一个 1920×1080 分辨率的浏览器窗口,并自动记录你的每一步操作。同时,会在终端输出等效的 Python 代码,非常适合用于初始脚本的生成。


三、手动编写一个简单的页面自动化示例

以下是使用 sync_playwright() 编写的最小自动化示例。该脚本打开浏览器,进入目标页面,并等待页面加载完成。

from playwright.sync_api import sync_playwrightwith sync_playwright() as p: browser = p.chromium.launch(headless=False) # 非无头模式,便于调试 page = browser.new_page() page.goto(\"https://***.com/\") # 示例:等待页面加载完 page.wait_for_load_state(\"networkidle\") # 示例:假设你想点击导航中的某个按钮,需根据 hoverair.com 的结构定位元素 # page.click(\"text=Shop Now\") # 示例,视页面内容调整 # 可在这里添加更多交互... browser.close()

四、完整的自动化流程实现:从菜单到结账

接下来是一个更完整的场景脚本,模拟了用户从访问页面、浏览产品、选择规格、加入购物车到点击结账的全过程:

import refrom playwright.sync_api import Playwright, sync_playwright, expectdef run(playwright: Playwright) -> None: browser = playwright.chromium.launch(headless=False) context = browser.new_context() page = context.new_page() page.goto(\"https://***.com/\") menu = page.locator(\"text=Featured products\").first # 或根据实际结构找导航栏项 menu.hover() # 触发悬停 page.wait_for_timeout(500) # 稍等下拉弹出(可调) page.get_by_text(\"X1 PRO | PROMAX\").first.click() page.get_by_role(\"link\", name=\"Shop\").first.click() page.locator(\"label\").filter(has_text=\"Cycling Combo $1,089 $1,292 -\").locator(\"div\").first.click() page.get_by_role(\"checkbox\", name=\"Beacon & JoySticks Beacon &\").check() # 等待“ADD TO CART”按钮可见且可点击 add_to_cart_btn = page.get_by_role(\"button\", name=\"ADD TO CART\") add_to_cart_btn.wait_for(state=\"visible\", timeout=10000) add_to_cart_btn.click() page.get_by_role(\"button\", name=\"skip\").click() page.get_by_role(\"button\", name=\"Increase quantity for HOVERAir X1 PRO & PROMAX\").click() page.get_by_role(\"button\", name=\"Check out\").click() page.close() # --------------------- context.close() browser.close()with sync_playwright() as playwright: run(playwright)

五、关键技术点解析

  1. 非无头模式(headless=False)
    有利于调试和观察脚本行为,开发阶段建议打开。

  2. 等待机制

    • wait_for_timeout(ms):强制等待时间,不推荐作为主要方式,但在动画场景中仍可使用。

    • wait_for_load_state(\"networkidle\"):等待页面静止状态,避免因加载未完成而操作失败。

    • .wait_for(state=\"visible\"):等待元素真正可见和可交互。

  3. 定位方式多样

    • get_by_roleget_by_text 是基于页面语义的方式,推荐优先使用。

    • locator().filter() 是处理多个匹配项中筛选的利器。


六、最佳实践建议

  • 使用上下文(context)管理会话:有助于清晰地控制 cookie/session。

  • 编写可复用函数:将常用操作封装成函数,便于调试与维护。

  • 结合录制与手写代码:录制工具适合原型生成,但仍需人工优化定位方式和结构。


结语

通过本文你可以看到,Playwright 不仅支持强大的页面操作和交互,还能通过 codegen 工具快速生成可运行的脚本,极大提高开发和测试效率。

随着自动化需求的不断增长,掌握像 Playwright 这样现代化的测试工具,将是你构建高效、稳定系统的重要保障。