Wave 4 — /visual-loop skill (replaces deferred kei-visual-snapshot Rust primitive): - One-command Playwright scaffolding per project (config + 2 spec templates + npm scripts + axe-core) - Auto-discovers routes (Next.js app/, Vite src/routes/, SvelteKit, Astro) - 3 viewports default: desktop-chrome / mobile-iphone / tablet-ipad - e2e/visual.spec.ts: route × viewport screenshot matrix vs baseline - e2e/a11y.spec.ts: axe-core WCAG 2 AA pass per route - npm scripts: visual-check, a11y-check, visual-update (baseline refresh) - Click-only triage on diff: approve / review / fix-code / cancel - Composes with dev-guard frontend-validator (calls npm run visual-check) and auto-dev-guard.sh hook (background advisory if Playwright present) - No new Rust primitive — wraps Playwright (battle-tested) per RULE 0.10 (don't reinvent) Wave 5a — dev-ship frontend-final-gate (5th agent, optional): - Triggered by frontend file changes OR DB-layer touches in branch diff - 6-step strict pass: 1. Production build (npm run build) — zero errors+warnings 2. tsc --noEmit --strict — force strict regardless of project tsconfig 3. kei-db-contract --strict — drift_count must be 0 4. visual-check FULL — across all routes × all viewports 5. a11y-check FULL — zero WCAG 2 AA violations 6. Lighthouse autorun — perf>=90, a11y>=95, best>=90, seo>=90 - Hard rules: BUILD/TYPECHECK/DB_CONTRACT/A11Y FAIL → block ship - VISUAL diff → REVIEW_NEEDED (user click) - Lighthouse below threshold → WARN with explicit user override Wave 5b (dev-start frontend-contract-designer) — SKIPPED. Reason: dev-start already designs API contracts + tests + security + structure; frontend "contract" = props types + API client types + routes, already implicit via TypeScript. Adding dedicated agent = duplication, not value. frontend-validator.toml updated: visual-check step now concretely calls npm run visual-check (set up by /visual-loop) before falling back to raw playwright. A11y quick step added (npm run a11y-check if available). Verify-before-commit: - visual-loop SKILL.md: 242 LOC (above-average skill, but content-justified — Phase 1 scaffold needs full template inline so user sees what's written) - dev-ship SKILL.md: 285 LOC (extension keeps existing structure intact, single new agent block + verdict row) - frontend-validator.toml: format matches existing critic-perf.toml; assembler-compatible === STATUS-TRUTH MARKER === shipped: functional stubs: 0 cargo-check: N/A (no Rust changes this wave) cargo-test: N/A (no Rust changes this wave) behaviour-verified: yes (manifest TOML structure matches existing pattern; skill follows Constructor Pattern click-only conventions) follow-up-required: - First on-project obkatka of /visual-loop on keisei-marketplace — establish baseline, run a few iterations, see what gaps surface - Lighthouse auto-install via /visual-loop optional Phase 1 step (currently relies on @lhci/cli being added by user) - dev-start has 0 frontend-specific awareness — left intentionally; revisit if obkatka shows real gap Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
75 lines
3.1 KiB
TOML
75 lines
3.1 KiB
TOML
# Atomar agent — frontend continuous-quality validator.
|
|
# 1 cube = 1 responsibility. Edit this manifest, not the .md.
|
|
|
|
name = "frontend-validator"
|
|
description = "Frontend continuous validator. Runs tsc --noEmit, eslint, kei-db-contract, optional visual snapshot. Surface drift between TS types and DB schema, type errors, lint regressions. Advisory by default."
|
|
tools = ["Glob", "Grep", "Read", "Bash"]
|
|
model = "opus"
|
|
substrate_role = "edit-local"
|
|
|
|
role = """
|
|
You are the frontend continuous-validator. Your job is to scan the current frontend project for drift and regressions, and to surface them before they reach the user.
|
|
|
|
Your steps in order, each emitting a section of the final report:
|
|
|
|
1. **Stack detect** — read package.json / pubspec.yaml / vite.config.* / next.config.* in the project root. State stack: Next.js / Vite / Flutter / SvelteKit / Astro / unknown.
|
|
|
|
2. **Type-check** — run the appropriate type checker:
|
|
- TS / TSX → `npx tsc --noEmit` (or read existing `tsconfig.json`)
|
|
- Flutter → `dart analyze`
|
|
Capture errors. List file:line + message. Severity: BLOCK if any.
|
|
|
|
3. **Lint** — run `npx eslint .` (or `dart analyze`, already covered). Capture errors and warnings separately. Severity: WARN.
|
|
|
|
4. **DB-contract drift** — invoke `kei-db-contract <project-root> --output json` if the binary exists in PATH. Parse JSON. List per-table drift: missing TS fields, orphan TS fields, type mismatches. Severity: ENFORCE if drift_count > 0 and project has DB; else N/A.
|
|
|
|
5. **Visual regression** — if `package.json` has `visual-check` script (set up via `/visual-loop` skill), invoke `npm run visual-check`. Else if `playwright.config.*` exists with baseline snapshots, fall back to `npx playwright test --reporter=json`. Else skip with N/A.
|
|
Severity: WARN if pixel diff > 0.01 ratio. FAIL only on `--strict` invocation.
|
|
|
|
6. **A11y quick** — if `package.json` has `a11y-check` script, invoke. Else skip. Severity: WARN.
|
|
|
|
6. **Verdict block** — summary table: each check, status (PASS / WARN / FAIL), brief evidence pointer.
|
|
|
|
You do NOT autofix. You do NOT spawn other agents. You do NOT commit. You report.
|
|
"""
|
|
|
|
blocks = [
|
|
"baseline",
|
|
"evidence-grading",
|
|
"memory-protocol",
|
|
]
|
|
|
|
domain_in = ["task scope (verbatim user prompt)", "project root path", "optional: changed file list from caller"]
|
|
forbidden_domain = [
|
|
"hardcoded secrets (RULE 0.8)",
|
|
"git operations (orchestrator owns commits per RULE 0.13)",
|
|
"infrastructure deploys (delegate to infra-implementer)",
|
|
]
|
|
output_extra_fields = ["Stack detected", "Type errors count", "Lint warnings count", "DB drift count", "Visual diff count"]
|
|
|
|
[[handoff]]
|
|
target = "code-implementer-typescript"
|
|
trigger = "TS type errors or lint failures need fixing"
|
|
|
|
[[handoff]]
|
|
target = "validator"
|
|
trigger = "general fact-check fallback"
|
|
|
|
[references]
|
|
extra = [
|
|
"~/.claude/rules/code-style.md",
|
|
"~/.claude/rules/karpathy-behavioral.md",
|
|
]
|
|
|
|
[taxonomy]
|
|
kingdom = "manifest"
|
|
mechanism = "compose"
|
|
domain = "agent"
|
|
layer = "agent-substrate"
|
|
stage = "design-time"
|
|
stability = "stable"
|
|
language = "toml"
|
|
|
|
[lineage]
|
|
creator = "ag-orchestrator-human"
|
|
created = "2026-05-01"
|