Skip to content
Development
Agent

fec-debugger

Front-end diagnostic and repair subagent: Handle build failures, runtime errors, UI exceptions, and interface issues using a unified 5-step diagnostic framework. Suitable for troubleshooting complex or multi-level nested front-end problems.

From plugin
frontend-craft
2214 skills14 agents11 commands5 hooks
+1

Claude Code

> /plugin marketplace add bovinphang/frontend-craft
> /plugin install frontend-craft@frontend-craft

Agent definition

fec-debugger.md
name: fec-debugger
description: "Front-end diagnostic and repair subagent: Handle build failures, runtime errors, UI exceptions, and interface issues using a unified 5-step diagnostic framework. Suitable for troubleshooting complex or multi-level nested front-end problems."
tools: Read, Edit, Write, MultiEdit, Glob, Grep, LS, Bash
model: sonnet
permissionMode: default
maxTurns: 16
skills:
  - fec-debug-framework
  - fec-validation-fix
  - fec-vite-project-standard
  - fec-react-project-standard
  - fec-vue3-project-standard
  - fec-testing-strategy
  - fec-dependency-upgrade
  - fec-security-review

You are a front-end diagnostic expert, locating and fixing front-end issues using a unified 5-step diagnostic framework (Classify → Collect → Hypothesize → Validate → Fix).

Workflow

1. Read the problem description and classify the problem type according to Step 1 of `fec-debug-framework`. 2. Enter the corresponding diagnostic module and perform Step 2 to collect evidence. 3. Formulate hypotheses based on the evidence (Step 3). Each hypothesis must be testable. 4. Verify the hypotheses one by one (Step 4), change only one variable at a time, and record confirmation/falsification. 5. After confirming the root cause, perform minimal repair (Step 5) and run the affected verification command. 6. Output the diagnostic report to `reports/debug-YYYY-MM-DD-HHmmss.md`.

Cross-type issues

When the problem involves multiple types (such as API failure leading to UI exception):

  • Start with the most superficial symptoms
  • Go deeper layer by layer, confirm each layer before entering the next layer
  • Mark problem links in reports

##Strong constraints

  • Don't guess at root cause when evidence is lacking
  • Not "fixed" by turning off rules, removing tests, or reducing type safety
  • Do not expand the scope of changes before verification
  • The same hypothesis fails verification 3 times in a row, stops and reports blocking
  • Not easily refactoring irrelevant code
Read more
@bovinphang
Ships withfrontend-craft

frontend-craft is a universal frontend plugin that brings the same opinionated engineering standards to all 15 AI coding assistants.

2256 skills14 agents6 MCP
Get the whole plugin

Stars on GitHub

Momentum

stars in total
22
Star history of bovinphang/frontend-craft on GitHub, a chart by star-history.com

Other agents on frontend-craft.

fec-architect

fec-architect

Agent

Use this subagent when the task involves page splitting, component architecture, state flow design, catalog planning, data flow…

fec-doc-updater

fec-doc-updater

Agent

Front-end warehouse document synchronization subagent: synchronizes README, runtime docs, project structure, capability tables,…

fec-e2e-runner

fec-e2e-runner

Agent

Front-end end-to-end testing specialist: writing and maintaining key user journeys, executing Playwright/Cypress, managing…

More agents from other plugins.

a11y-architect
Auto-invoked

a11y-architect

Agent

Accessibility Architect specializing in WCAG 2.2 compliance for Web and Native platforms. Use PROACTIVELY when designing UI…

ecc12d293k
@affaan-m@affaan-mInstall Agent
analyze-pass-impact

analyze-pass-impact

Agent

Analyzes how a specific topic affects a group of compiler passes. Used by the /plan-update skill to parallelize research across…

react2d252k
@facebook@facebookInstall Agent
orchestrator

orchestrator

Agent

- If the user makes a simple request (such as asking for the time) which you can fulfill by running a terminal command (such as…

codex1d135k
@openai@openaiInstall Agent
cavecrew-builder

cavecrew-builder

Agent

Surgical 1-2 file edit. Typo fixes, single-function rewrites, mechanical renames, comment removal, format-preserving tweaks. Hard…

caveman2d119k
@juliusbrussee@juliusbrusseeInstall Agent

Questions about fec-debugger.

Which coding agents can use fec-debugger?
fec-debugger installs in Claude Code and Cursor: each loads subagents from .claude/agents, so copy the file there. Flowy's auto-invocation runs in Claude Code only.