Skills

Debug Frontend in Browser

Traces intermittent UI, stale state and navigation bugs and diagnoses regressions.

Install

npx skills add lobehub/lobehub --skill debug-frontend-with-browser -g -a claude-code -y
Repository
lobehub/lobehub83.7k
Category
Testing
Updated
3d ago
License
See repository
Context cost
Mediumabout 1,608 tokens
Runs scripts
No, instructions only

What it does

Use for intermittent UI, stale state, ordering, navigation or browser-only bugs. Extends acceptance with boundary tracing and regression diagnosis.

Debug Frontend with Browser

Find the first boundary where correct data becomes incorrect. This skill extends acceptance; it does not define a separate test workflow.

Mandatory foundation

Before any browser, Electron, network, cache, or application interaction:

  1. Read ../acceptance/SKILL.md and the project's PROCESS.md in full.
  2. Follow its target grounding, living logs, project adapter, environment and auth checks, approval gate, evidence rules, publication, and teardown.
  3. Enter this diagnostic workflow only after acceptance has established the approved execution surface. If its environment or auth gate is blocked, stop there instead of inventing another execution path.
  4. Use the isolated environment and fixture strategy selected by the project adapter. Never use the user's signed-in production browser or Electron client as a fixture container or test sandbox.
  5. Treat an explicit production investigation as read-only unless the user separately authorizes an exact live mutation and the project adapter permits it. This skill never grants production-mutation authority.
  6. Never read secret files or print credentials, tokens, private content, or full live objects. Return structural projections only.

If acceptance is unavailable, say so and stop before touching a live surface.

Responsibility boundary

Read the whole SKILL.md on GitHub

More in Testing