测试抓取
- 作者仓库星标 90,202
- 作者更新于 实时读取
- 作者仓库 playwright
- 领域
- 通用
- 兼容 Agent
-
- Claude Code
- Cursor
- Cline
- Codex
- Windsurf
- Gemini CLI
- +20
- 信任分
- 88 / 100 · 社区维护
- 作者 / 版本 / 许可
- @microsoft · 未声明 license
- Token 消耗评级
- 低消耗
- 接入复杂程度
- 即装即用
- 是否需要外部 API Key
- 不需要
- 兼容的系统
- macOS · Linux · Windows
- 底层运行要求
- 无特殊要求
- 文件与系统权限
-
- 只读
- 允许写入 / 修改
- 网络行为
- 仅限本地
- 安装命令数
- 26 条
档案由构建时根据 SKILL.md 与安装命令自动衍生,可能与作者实际意图存在差异。
需要注意: 未限定 allowed-tools,默认拥有全部工具权限。
---
name: playwright-trace
description: Inspect Playwright trace files from the command line — list actions, view requests, console, err…
category: 通用
runtime: 无特殊运行时
---
# playwright-trace 输出预览
## PART A: 任务判断
- 适用问题:通用任务拆解、检查和交付。
- 输入要求:目标材料、限制条件、期望输出和验收方式。
- 证据边界:围绕“Workflow / Commands / Open a trace”读取原文规则,不把推断写成作者承诺。
## PART B: 执行结果
- **01** 任务判断:确认你的需求是否属于通用任务拆解、检查和交付,并标出输入、限制和预期结果。
- **02** 执行计划:优先按“Workflow / Commands / Open a trace”拆成步骤,说明每一步会读取什么、修改什么、产出什么。
- **03** 交付结果:给出可复制的命令、文件改动、检查清单或内容草稿,并说明如何继续迭代。
- **04** 风险边界:结合 读取文件、写入/修改文件、主要在本地完成、通常不需要额外 API Key 给出执行前确认项。
## Running Rules
- 读取文件、写入/修改文件;主要在本地完成;通常不需要额外 API Key。
- 先小样例验证,再放大到真实任务。
- 交付时同时给结果、检查口径和下一步迭代建议。 原文没有稳定的斜杠命令要求。安装验证后通常全局生效,直接在对话里点名这个 Skill 并描述任务即可。
告诉 Agent 目标文件或材料、期望结果、不可改范围、是否允许联网或执行命令。本 Skill 的权限画像是:读取文件、写入/修改文件。
先用一个小任务确认它会围绕“Workflow / Commands / Open a trace”工作;涉及文件或命令时,先看 diff、日志、预览或测试结果。
检查最终产物是否包含明确结果、必要证据和下一步动作;如果输出泛泛而谈,就补充输入、边界和验收标准后重跑。
---
name: playwright-trace
description: Inspect Playwright trace files from the command line — list actions, view requests, console, err…
category: 通用
source: microsoft/playwright
---
# playwright-trace
## 什么时候使用
- 用于组织测试、定位失败并形成修复闭环 适合处理通用任务拆解、检查、交付和复盘,核心价值是把输入、判断、执行、验证和交付边界固定下来,避免 Agent 泛泛回答。 把任务拆成可执行、可检查、可继续迭代的步骤;通常不需要额外 API Key…
- 面向通用任务拆解、检查和交付,优先处理能明确输入、步骤和验收标准的工作。
## 需要提供什么
- 目标材料、目录范围、期望结果和不可改动内容。
- 是否允许联网、执行命令、读写文件或调用外部服务。
## 执行规则
- 围绕「Workflow / Commands / Open a trace」组织步骤,不把推断写成作者事实。
- 读取文件、写入/修改文件;主要在本地完成;通常不需要额外 API Key。
- 先跑小样例,确认结果可检查后再扩大任务范围。
## 输出要求
- 给出最终产物、关键证据、验证方式和下一步动作。
- 信息不足时标记 unknown,不编造命令、平台或依赖。 作者原文负责流程事实;仓库文件负责来源和命令;流狐只补充适用场景、限制和质量判断。
skill "playwright-trace" {
输入层 -> 用户目标 + 目标文件 + 禁止范围 + 验收标准
上下文层 -> Workflow / Commands / Open a trace
规则层 -> SKILL.md 触发条件 / 执行顺序 / 输出格式
运行层 -> 无特殊运行时 | 读取文件、写入/修改文件 | 主要在本地完成
安全层 -> 通常不需要额外 API Key + 小任务验证 + diff / 日志复核
输出层 -> 可复制结果 + 检查清单 + 下一步迭代
} Playwright Trace CLI
Inspect .zip trace files produced by Playwright tests without opening a browser.
Workflow
- Start with
trace open <trace.zip>to extract the trace and see its metadata. - Use
trace actionsto see all actions with their action IDs. - Use
trace action <action-id>to drill into a specific action — see parameters, logs, source location, and available snapshots. - Use
trace requests,trace console, ortrace errorsfor cross-cutting views. - Use
trace snapshot <action-id>to get the DOM snapshot, or run a browser command against it. - Use
trace closeto remove the extracted trace data when done.
All commands after open operate on the currently opened trace — no need to pass the trace file again. Opening a new trace replaces the previous one.
Commands
Open a trace
# Extract trace and show metadata: browser, viewport, duration, action/error counts
npx playwright trace open <trace.zip>
Close a trace
# Remove extracted trace data
npx playwright trace close
Actions
# List all actions as a tree with action IDs and timing
npx playwright trace actions
# Filter by action title (regex, case-insensitive)
npx playwright trace actions --grep "click"
# Only failed actions
npx playwright trace actions --errors-only
Action details
# Show full details for one action: params, result, logs, source, snapshots
npx playwright trace action <action-id>
The action command displays available snapshot phases (before, input, after) and the exact command to extract them.
Requests
# All network requests: method, status, URL, duration, size
npx playwright trace requests
# Filter by URL pattern
npx playwright trace requests --grep "api"
# Filter by HTTP method
npx playwright trace requests --method POST
# Only failed requests (status >= 400)
npx playwright trace requests --failed
Request details
# Show full details for one request: headers, body, security
npx playwright trace request <request-id>
Console
# All console messages and stdout/stderr
npx playwright trace console
# Only errors
npx playwright trace console --errors-only
# Only browser console (no stdout/stderr)
npx playwright trace console --browser
# Only stdout/stderr (no browser console)
npx playwright trace console --stdio
Errors
# All errors with stack traces and associated actions
npx playwright trace errors
Snapshots
The snapshot command loads the DOM snapshot for an action into a headless browser and runs a single browser command against it. Without a browser command, it returns the accessibility snapshot.
# Get the accessibility snapshot (default)
npx playwright trace snapshot <action-id>
# Use a specific phase
npx playwright trace snapshot <action-id> --name before
# Run eval to query the DOM
npx playwright trace snapshot <action-id> -- eval "document.title"
npx playwright trace snapshot <action-id> -- eval "document.querySelector('#error').textContent"
# Eval on a specific element ref (from the snapshot)
npx playwright trace snapshot <action-id> -- eval "el => el.getAttribute('data-testid')" e5
# Take a screenshot of the snapshot
npx playwright trace snapshot <action-id> -- screenshot
# Redirect output to a file
npx playwright trace snapshot <action-id> -- eval "document.body.outerHTML" --filename=page.html
npx playwright trace snapshot <action-id> -- screenshot --filename=screenshot.png
Only three browser commands are useful on a frozen snapshot: snapshot, eval, and screenshot.
Attachments
# List all trace attachments
npx playwright trace attachments
# Extract an attachment by its number
npx playwright trace attachment 1
npx playwright trace attachment 1 -o out.png
Typical investigation
# 1. Open the trace and see what's inside
npx playwright trace open test-results/my-test/trace.zip
# 2. What actions ran?
npx playwright trace actions
# 3. Which action failed?
npx playwright trace actions --errors-only
# 4. What went wrong?
npx playwright trace action 12
# 5. What did the page look like at that moment?
npx playwright trace snapshot 12
# 6. Query the DOM for more detail
npx playwright trace snapshot 12 -- eval "document.querySelector('.error-message').textContent"
# 7. Any relevant network failures?
npx playwright trace requests --failed
# 8. Any console errors?
npx playwright trace console --errors-only
先判断是否适合
作者设计意图
作者的方法与取舍
边界和复核