logan
5ca6cad45a
A coding agent could develop this repo's Go packages and could not develop the application: every path to running YellowJacket ended in a blocking GTK window, so 265 bound methods, 46 events, 33 component directories and 13 stores had exactly one form of verification available — `tsc --noEmit`. The unlock is that `wails dev`'s dev server on :34115 serves the real frontend with the real generated bindings against the same Go backend a desktop window attaches to, so a plain Chromium under Xvfb gets a fully functional app. Four test tiers now exist, cheapest first: - `make ui-test` — 313 Vitest tests in a real browser in ~2 s, no app, no backend, no display. Works because `frontend/wailsjs/` is a pure passthrough to `window.go`/`window.runtime`, so faking just those two globals runs the real bindings and the real store code. - `make test` — services in-process, asserting on the payload the frontend would receive, via a new `events.Emit` wrapper. - `make dev-headless` + `playwright-cli` — the real app, driven interactively, with an event bridge on `window.__yjEvents` and a dev-only control surface at `/__test/`. - `make e2e` — 19 of those flows frozen as Playwright specs. `events.Emit(ctx, …)` replaces all 35 direct `runtime.EventsEmit` call sites: wails' `getEvents` `log.Fatalf`s on any context without its runtime, so those paths could not run under test and a background worker could take the app down. Four packages had each hand-rolled the same guard; nine more guarded on `ctx != nil`, which does not help. `TestNoDirectRuntimeEmits` fails the build on a new one. Fixtures are generated, not committed (`make testdata`), and seeds are built by *running the app* — never by hand-writing config and DB rows, which would be a second description of a valid YJ_HOME. `.gitea/workflows/ci.yml` is the first workflow here that tests anything; the other three only package, so `gitea_ci` reported only packaging jobs and misled anyone asking whether a push was healthy. Both jobs were prototyped to green in a bare ubuntu:24.04 container before the YAML was written, which immediately caught `make lint` linting three configurations that nothing builds: all three passes omitted `webkit2_41`, so wails resolved webkit2gtk-4.0 — which Arch still ships and Ubuntu 24.04 dropped. Operational instructions live in `.pi/skills/yellowjacket-dev/`, measured discoveries in `.planning/NOTES.md`, and architecture in `CLAUDE.md` — split by tense, not by topic, because a topical split gives every new fact two plausible homes. `make skill-check` fails a commit if the skill cites a make target that does not exist.
140 lines
3.4 KiB
Markdown
140 lines
3.4 KiB
Markdown
# Tracing
|
|
|
|
Capture detailed execution traces for debugging and analysis. Traces include DOM snapshots, screenshots, network activity, and console logs.
|
|
|
|
## Basic Usage
|
|
|
|
```bash
|
|
# Start trace recording
|
|
playwright-cli tracing-start
|
|
|
|
# Perform actions
|
|
playwright-cli open https://example.com
|
|
playwright-cli click e1
|
|
playwright-cli fill e2 "test"
|
|
|
|
# Stop trace recording
|
|
playwright-cli tracing-stop
|
|
```
|
|
|
|
## Trace Output Files
|
|
|
|
When you start tracing, Playwright creates a `traces/` directory with several files:
|
|
|
|
### `trace-{timestamp}.trace`
|
|
|
|
**Action log** - The main trace file containing:
|
|
- Every action performed (clicks, fills, navigations)
|
|
- DOM snapshots before and after each action
|
|
- Screenshots at each step
|
|
- Timing information
|
|
- Console messages
|
|
- Source locations
|
|
|
|
### `trace-{timestamp}.network`
|
|
|
|
**Network log** - Complete network activity:
|
|
- All HTTP requests and responses
|
|
- Request headers and bodies
|
|
- Response headers and bodies
|
|
- Timing (DNS, connect, TLS, TTFB, download)
|
|
- Resource sizes
|
|
- Failed requests and errors
|
|
|
|
### `resources/`
|
|
|
|
**Resources directory** - Cached resources:
|
|
- Images, fonts, stylesheets, scripts
|
|
- Response bodies for replay
|
|
- Assets needed to reconstruct page state
|
|
|
|
## What Traces Capture
|
|
|
|
| Category | Details |
|
|
|----------|---------|
|
|
| **Actions** | Clicks, fills, hovers, keyboard input, navigations |
|
|
| **DOM** | Full DOM snapshot before/after each action |
|
|
| **Screenshots** | Visual state at each step |
|
|
| **Network** | All requests, responses, headers, bodies, timing |
|
|
| **Console** | All console.log, warn, error messages |
|
|
| **Timing** | Precise timing for each operation |
|
|
|
|
## Use Cases
|
|
|
|
### Debugging Failed Actions
|
|
|
|
```bash
|
|
playwright-cli tracing-start
|
|
playwright-cli open https://app.example.com
|
|
|
|
# This click fails - why?
|
|
playwright-cli click e5
|
|
|
|
playwright-cli tracing-stop
|
|
# Open trace to see DOM state when click was attempted
|
|
```
|
|
|
|
### Analyzing Performance
|
|
|
|
```bash
|
|
playwright-cli tracing-start
|
|
playwright-cli open https://slow-site.com
|
|
playwright-cli tracing-stop
|
|
|
|
# View network waterfall to identify slow resources
|
|
```
|
|
|
|
### Capturing Evidence
|
|
|
|
```bash
|
|
# Record a complete user flow for documentation
|
|
playwright-cli tracing-start
|
|
|
|
playwright-cli open https://app.example.com/checkout
|
|
playwright-cli fill e1 "4111111111111111"
|
|
playwright-cli fill e2 "12/25"
|
|
playwright-cli fill e3 "123"
|
|
playwright-cli click e4
|
|
|
|
playwright-cli tracing-stop
|
|
# Trace shows exact sequence of events
|
|
```
|
|
|
|
## Trace vs Video vs Screenshot
|
|
|
|
| Feature | Trace | Video | Screenshot |
|
|
|---------|-------|-------|------------|
|
|
| **Format** | .trace file | .webm video | .png/.jpeg image |
|
|
| **DOM inspection** | Yes | No | No |
|
|
| **Network details** | Yes | No | No |
|
|
| **Step-by-step replay** | Yes | Continuous | Single frame |
|
|
| **File size** | Medium | Large | Small |
|
|
| **Best for** | Debugging | Demos | Quick capture |
|
|
|
|
## Best Practices
|
|
|
|
### 1. Start Tracing Before the Problem
|
|
|
|
```bash
|
|
# Trace the entire flow, not just the failing step
|
|
playwright-cli tracing-start
|
|
playwright-cli open https://example.com
|
|
# ... all steps leading to the issue ...
|
|
playwright-cli tracing-stop
|
|
```
|
|
|
|
### 2. Clean Up Old Traces
|
|
|
|
Traces can consume significant disk space:
|
|
|
|
```bash
|
|
# Remove traces older than 7 days
|
|
find .playwright-cli/traces -mtime +7 -delete
|
|
```
|
|
|
|
## Limitations
|
|
|
|
- Traces add overhead to automation
|
|
- Large traces can consume significant disk space
|
|
- Some dynamic content may not replay perfectly
|