Playwright CLI 终端浏览器自动化技能 - 无需全局安装，快速实现网页交互与测试

playwright by openai/skills

951 周安装量

15,300 GitHub Stars

GitHub

安装命令

npx skills add https://github.com/openai/skills --skill playwright

开发自动化测试

🇨🇳中文介绍

Playwright CLI 技能

使用 playwright-cli 在终端中驱动真实浏览器。优先使用捆绑的包装脚本，这样即使 CLI 未全局安装也能工作。将此技能视为 CLI 优先的自动化。除非用户明确要求测试文件，否则不要转向 @playwright/test。

先决条件检查（必需）

在提议命令之前，检查 npx 是否可用（包装脚本依赖于此）：

command -v npx >/dev/null 2>&1

如果不可用，请暂停并提示用户安装 Node.js/npm（它提供 npx）。逐字提供以下步骤：

# 验证 Node/npm 是否已安装
node --version
npm --version

# 如果缺失，安装 Node.js/npm，然后：
npm install -g @playwright/cli@latest
playwright-cli --help

一旦 npx 存在，就可以继续使用包装脚本。全局安装 playwright-cli 是可选的。

广告位招租

在这里展示您的产品或服务

触达数万 AI 开发者，精准高效

联系我们

技能路径（设置一次）

export CODEX_HOME="${CODEX_HOME:-$HOME/.codex}"
export PWCLI="$CODEX_HOME/skills/playwright/scripts/playwright_cli.sh"

用户作用域内的技能安装在 $CODEX_HOME/skills 下（默认：~/.codex/skills）。

使用包装脚本：

"$PWCLI" open https://playwright.dev --headed
"$PWCLI" snapshot
"$PWCLI" click e15
"$PWCLI" type "Playwright"
"$PWCLI" press Enter
"$PWCLI" screenshot

如果用户偏好全局安装，这也是有效的：

npm install -g @playwright/cli@latest
playwright-cli --help

打开页面。
获取快照以获取稳定的元素引用。
使用最新快照中的引用进行交互。
在导航或显著的 DOM 更改后重新获取快照。
在有用时捕获工件（截图、pdf、追踪）。

最小循环示例：

"$PWCLI" open https://example.com
"$PWCLI" snapshot
"$PWCLI" click e3
"$PWCLI" snapshot

何时需要重新获取快照

在以下操作后重新获取快照：

导航
点击会显著改变 UI 的元素
打开/关闭模态框或菜单
标签页切换

引用可能会失效。当命令因引用缺失而失败时，请重新获取快照。

表单填写和提交

"$PWCLI" open https://example.com/form
"$PWCLI" snapshot
"$PWCLI" fill e1 "user@example.com"
"$PWCLI" fill e2 "password123"
"$PWCLI" click e3
"$PWCLI" snapshot

使用追踪调试 UI 流程

"$PWCLI" open https://example.com --headed
"$PWCLI" tracing-start
# ...交互操作...
"$PWCLI" tracing-stop

"$PWCLI" tab-new https://example.com
"$PWCLI" tab-list
"$PWCLI" tab-select 0
"$PWCLI" snapshot

包装脚本使用 npx --package @playwright/cli playwright-cli，因此 CLI 无需全局安装即可运行：

除非仓库已经标准化为全局安装，否则优先使用包装脚本。

仅打开你需要的部分：

CLI 命令参考：references/cli.md
实用工作流程和故障排除：references/workflows.md

在引用像 e12 这样的元素 ID 之前，务必先获取快照。
当引用似乎失效时，重新获取快照。
除非必要，优先使用显式命令而非 eval 和 run-code。
当你没有最新的快照时，使用占位符引用如 eX 并说明原因；不要使用 run-code 绕过引用。
当视觉检查有帮助时，使用 --headed。
在此仓库中捕获工件时，使用 output/playwright/ 目录，避免引入新的顶级工件文件夹。
默认使用 CLI 命令和工作流程，而非 Playwright 测试规范。

🇺🇸English

Playwright CLI Skill

Drive a real browser from the terminal using playwright-cli. Prefer the bundled wrapper script so the CLI works even when it is not globally installed. Treat this skill as CLI-first automation. Do not pivot to @playwright/test unless the user explicitly asks for test files.

Prerequisite check (required)

Before proposing commands, check whether npx is available (the wrapper depends on it):

command -v npx >/dev/null 2>&1

If it is not available, pause and ask the user to install Node.js/npm (which provides npx). Provide these steps verbatim:

# Verify Node/npm are installed
node --version
npm --version

# If missing, install Node.js/npm, then:
npm install -g @playwright/cli@latest
playwright-cli --help

Once npx is present, proceed with the wrapper script. A global install of playwright-cli is optional.

Skill path (set once)

export CODEX_HOME="${CODEX_HOME:-$HOME/.codex}"
export PWCLI="$CODEX_HOME/skills/playwright/scripts/playwright_cli.sh"

User-scoped skills install under $CODEX_HOME/skills (default: ~/.codex/skills).

Quick start

Use the wrapper script:

"$PWCLI" open https://playwright.dev --headed
"$PWCLI" snapshot
"$PWCLI" click e15
"$PWCLI" type "Playwright"
"$PWCLI" press Enter
"$PWCLI" screenshot

If the user prefers a global install, this is also valid:

npm install -g @playwright/cli@latest
playwright-cli --help

Core workflow

Open the page.
Snapshot to get stable element refs.
Interact using refs from the latest snapshot.
Re-snapshot after navigation or significant DOM changes.
Capture artifacts (screenshot, pdf, traces) when useful.

Minimal loop:

"$PWCLI" open https://example.com
"$PWCLI" snapshot
"$PWCLI" click e3
"$PWCLI" snapshot

When to snapshot again

Snapshot again after:

navigation
clicking elements that change the UI substantially
opening/closing modals or menus
tab switches

Refs can go stale. When a command fails due to a missing ref, snapshot again.

Recommended patterns

Form fill and submit

"$PWCLI" open https://example.com/form
"$PWCLI" snapshot
"$PWCLI" fill e1 "user@example.com"
"$PWCLI" fill e2 "password123"
"$PWCLI" click e3
"$PWCLI" snapshot

Debug a UI flow with traces

"$PWCLI" open https://example.com --headed
"$PWCLI" tracing-start
# ...interactions...
"$PWCLI" tracing-stop

Multi-tab work

"$PWCLI" tab-new https://example.com
"$PWCLI" tab-list
"$PWCLI" tab-select 0
"$PWCLI" snapshot

Wrapper script

The wrapper script uses npx --package @playwright/cli playwright-cli so the CLI can run without a global install:

"$PWCLI" --help

Prefer the wrapper unless the repository already standardizes on a global install.

References

Open only what you need:

CLI command reference: references/cli.md
Practical workflows and troubleshooting: references/workflows.md

Guardrails

Always snapshot before referencing element ids like e12.
Re-snapshot when refs seem stale.
Prefer explicit commands over eval and run-code unless needed.
When you do not have a fresh snapshot, use placeholder refs like eX and say why; do not bypass refs with run-code.
Use --headed when a visual check will help.
When capturing artifacts in this repo, use output/playwright/ and avoid introducing new top-level artifact folders.
Default to CLI commands and workflows, not Playwright test specs.

Weekly Installs

951

Repository

openai/skills

GitHub Stars

15.3K

First Seen

Feb 1, 2026

Security Audits

Gen Agent Trust HubFail SocketPass SnykFail

Installed on

codex851

opencode793

gemini-cli748

github-copilot723

cursor706

kimi-cli703

React 组合模式指南：Vercel 组件架构最佳实践，提升代码可维护性

102,200 周安装