HelloSun commited on
Commit
d6d2dfd
·
verified ·
1 Parent(s): 966bdf6

Remove temporary browser-test dependency SKILL.md

Browse files
node_modules/playwright-core/lib/tools/skills/playwright-trace/SKILL.md DELETED
@@ -1,174 +0,0 @@
1
- ---
2
- name: playwright-trace
3
- description: Inspect Playwright trace files from the command line — list actions, view requests, console, errors, snapshots and screenshots.
4
- allowed-tools: Bash(npx playwright trace:*)
5
- ---
6
-
7
- # Playwright Trace CLI
8
-
9
- Inspect `.zip` trace files produced by Playwright tests without opening a browser.
10
-
11
- ## Workflow
12
-
13
- 1. Start with `trace open <trace.zip>` to extract the trace and see its metadata.
14
- 2. Use `trace actions` to see all actions with their action IDs.
15
- 3. Use `trace action <action-id>` to drill into a specific action — see parameters, logs, source location, and available snapshots.
16
- 4. Use `trace requests`, `trace console`, or `trace errors` for cross-cutting views.
17
- 5. Use `trace snapshot <action-id>` to get the DOM snapshot, or run a browser command against it.
18
- 6. Use `trace close` to remove the extracted trace data when done.
19
-
20
- 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.
21
-
22
- ## Commands
23
-
24
- ### Open a trace
25
-
26
- ```bash
27
- # Extract trace and show metadata: browser, viewport, duration, action/error counts
28
- npx playwright trace open <trace.zip>
29
- ```
30
-
31
- ### Close a trace
32
-
33
- ```bash
34
- # Remove extracted trace data
35
- npx playwright trace close
36
- ```
37
-
38
- ### Actions
39
-
40
- ```bash
41
- # List all actions as a tree with action IDs and timing
42
- npx playwright trace actions
43
-
44
- # Filter by action title (regex, case-insensitive)
45
- npx playwright trace actions --grep "click"
46
-
47
- # Only failed actions
48
- npx playwright trace actions --errors-only
49
- ```
50
-
51
- ### Action details
52
-
53
- ```bash
54
- # Show full details for one action: params, result, logs, source, snapshots
55
- npx playwright trace action <action-id>
56
- ```
57
-
58
- The `action` command displays available snapshot phases (before, action, after) and the exact command to extract them.
59
-
60
- ### Requests
61
-
62
- ```bash
63
- # All network requests: start time (on the `trace actions` clock), method, status, URL, duration, size
64
- npx playwright trace requests
65
-
66
- # Filter by URL pattern
67
- npx playwright trace requests --grep "api"
68
-
69
- # Filter by HTTP method
70
- npx playwright trace requests --method POST
71
-
72
- # Only failed requests (status >= 400)
73
- npx playwright trace requests --failed
74
- ```
75
-
76
- ### Request details
77
-
78
- ```bash
79
- # Show full details for one request: headers, body, security
80
- npx playwright trace request <request-id>
81
- ```
82
-
83
- ### Console
84
-
85
- ```bash
86
- # All console messages and stdout/stderr
87
- npx playwright trace console
88
-
89
- # Only errors
90
- npx playwright trace console --errors-only
91
-
92
- # Only browser console (no stdout/stderr)
93
- npx playwright trace console --browser
94
-
95
- # Only stdout/stderr (no browser console)
96
- npx playwright trace console --stdio
97
-
98
- # Filter by message text pattern
99
- npx playwright trace console --grep "failed to fetch"
100
- ```
101
-
102
- ### Errors
103
-
104
- ```bash
105
- # All errors with stack traces and associated actions
106
- npx playwright trace errors
107
- ```
108
-
109
- ### Snapshots
110
-
111
- 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.
112
-
113
- ```bash
114
- # Get the accessibility snapshot (default)
115
- npx playwright trace snapshot <action-id>
116
-
117
- # Use a specific phase
118
- npx playwright trace snapshot <action-id> --phase before
119
-
120
- # Run eval to query the DOM
121
- npx playwright trace snapshot <action-id> -- eval "document.title"
122
- npx playwright trace snapshot <action-id> -- eval "document.querySelector('#error').textContent"
123
-
124
- # Eval on a specific element ref (from the snapshot)
125
- npx playwright trace snapshot <action-id> -- eval "el => el.getAttribute('data-testid')" e5
126
-
127
- # Take a screenshot of the snapshot
128
- npx playwright trace snapshot <action-id> -- screenshot
129
-
130
- # Redirect output to a file
131
- npx playwright trace snapshot <action-id> -- eval "document.body.outerHTML" --filename=page.html
132
- npx playwright trace snapshot <action-id> -- screenshot --filename=screenshot.png
133
- ```
134
-
135
- Only three browser commands are useful on a frozen snapshot: `snapshot`, `eval`, and `screenshot`.
136
-
137
- ### Attachments
138
-
139
- ```bash
140
- # List all trace attachments
141
- npx playwright trace attachments
142
-
143
- # Extract an attachment by its number
144
- npx playwright trace attachment 1
145
- npx playwright trace attachment 1 -o out.png
146
- ```
147
-
148
- ## Typical investigation
149
-
150
- ```bash
151
- # 1. Open the trace and see what's inside
152
- npx playwright trace open test-results/my-test/trace.zip
153
-
154
- # 2. What actions ran?
155
- npx playwright trace actions
156
-
157
- # 3. Which action failed?
158
- npx playwright trace actions --errors-only
159
-
160
- # 4. What went wrong?
161
- npx playwright trace action 12
162
-
163
- # 5. What did the page look like at that moment?
164
- npx playwright trace snapshot 12
165
-
166
- # 6. Query the DOM for more detail
167
- npx playwright trace snapshot 12 -- eval "document.querySelector('.error-message').textContent"
168
-
169
- # 7. Any relevant network failures?
170
- npx playwright trace requests --failed
171
-
172
- # 8. Any console errors?
173
- npx playwright trace console --errors-only
174
- ```