⚡

Playwright浏览器自动化工具Skill playwright-browser

这是一个基于Playwright的浏览器自动化CLI工具，支持通过命令行控制浏览器进行网页导航、元素交互和截图操作。该工具利用无障碍树进行精准元素定位，提供会话管理、页面快照、文本输入、元素点击和屏幕截图等功能，适用于自动化测试、网页数据抓取和界面自动化任务。关键词：Playwright自动化、浏览器控制、网页交互、CLI工具、无障碍测试、自动化测试、网页抓取、UI自动化。

测试 0 次安装 0 次浏览 更新于 3/2/2026

名称: playwright-browser 描述: 通过CLI控制Playwright浏览器 - 导航、交互和截图 版本: 1.0.0 许可证: MIT 兼容性: opencode

概述

用于控制Playwright浏览器的CLI工具。利用Playwright的无障碍树进行轻量、高效的页面交互。

交互式会话工作流

启动一个持久浏览器会话并对其执行命令：

# 启动会话（打开可见浏览器窗口）
bun .opencode/skill/playwright-browser/session.js start

# 导航到网站
bun .opencode/skill/playwright-browser/navigate.js https://duckduckgo.com

# 获取页面结构
bun .opencode/skill/playwright-browser/snapshot.js

# 在搜索框中输入并提交
bun .opencode/skill/playwright-browser/type.js "combobox:Search with DuckDuckGo" "github" --press Enter

# 点击结果
bun .opencode/skill/playwright-browser/click.js "link:GitHub"

# 截图
bun .opencode/skill/playwright-browser/screenshot.js --output result.png

# 完成后停止会话
bun .opencode/skill/playwright-browser/session.js stop

命令

会话

管理用于交互式使用的持久浏览器会话。

bun .opencode/skill/playwright-browser/session.js start
bun .opencode/skill/playwright-browser/session.js stop
bun .opencode/skill/playwright-browser/session.js status

选项：

  • --headless - 在无头模式下运行（默认：有头/可见）

示例：

bun .opencode/skill/playwright-browser/session.js start
bun .opencode/skill/playwright-browser/session.js start --headless
bun .opencode/skill/playwright-browser/session.js status
bun .opencode/skill/playwright-browser/session.js stop

导航

在浏览器中导航到URL。

bun .opencode/skill/playwright-browser/navigate.js <url>

示例：

bun .opencode/skill/playwright-browser/navigate.js https://example.com

快照

获取当前页面的无障碍树。

bun .opencode/skill/playwright-browser/snapshot.js

以文本格式显示页面结构。使用此命令查找要交互的元素。

输出格式：

- 导航:
  - 链接 "关于"
- 搜索:
  - 组合框 "搜索"
  - 按钮 "提交"

输入

在页面上的输入元素中输入文本。

bun .opencode/skill/playwright-browser/type.js <ref> <text> [--press Enter]

参数：

  • ref - 元素引用（角色:名称、文本:内容或CSS选择器）
  • text - 要输入的文本

选项：

  • --press <key> - 输入后按某个键（例如：Enter、Tab）

示例：

bun .opencode/skill/playwright-browser/type.js "combobox:Search" "hello" --press Enter
bun .opencode/skill/playwright-browser/type.js "input[name='q']" "搜索查询"

点击

点击页面上的元素。

bun .opencode/skill/playwright-browser/click.js <ref>

参数：

  • ref - 元素引用（角色:名称、文本:内容或CSS选择器）

示例：

bun .opencode/skill/playwright-browser/click.js "button:Submit"
bun .opencode/skill/playwright-browser/click.js "link:Sign in"

截图

截取当前页面的屏幕截图。

bun .opencode/skill/playwright-browser/screenshot.js [--output <path>] [--full]

选项：

  • --output <path> - 输出文件路径（默认：screenshot.png）
  • --full - 捕获完整页面（滚动整个页面）

示例：

bun .opencode/skill/playwright-browser/screenshot.js
bun .opencode/skill/playwright-browser/screenshot.js --output page.png

元素引用

与元素交互的命令（type、click）接受灵活的元素引用：

格式 示例 描述
role:name combobox:Search 无障碍角色和名称
text:content text:Sign in 包含文本的元素
CSS选择器 #login-btn 标准CSS选择器
CSS选择器 input[name='q'] 属性选择器

推荐工作流：

  1. 使用snapshot查看无障碍树
  2. 查找元素的角色和名称
  3. 使用role:name格式进行可靠的交互

错误恢复

命令提供有用的错误消息和建议：

  • 元素未找到：“元素’X’未找到。尝试：使用snapshot查看可用元素”
  • 会话问题：如果不存在会话，命令会自动启动一个
  • 导航失败：“在URL导航失败。尝试：navigate URL”

注意事项

  • 浏览器数据存储在项目根目录的.playwright-data/中
  • 持久上下文在会话之间维护cookie和localStorage
  • 命令使用networkidle等待以确保可靠的页面加载