| name | web-frontend-tester |
| description | Run frontend functional, accessibility, visual, and performance test planning with structured reports. |
| compatibility | codex, claude-code, claude-ai, agent-skills |
| license | Apache-2.0 |
| allowed-tools | ["read_file","write_file","run_terminal_cmd","web_search"] |
| metadata | {"category":"web-builder","stage":"8-frontend-testing","pipeline":"web-builder"} |
Web Frontend Tester
Objective
Validate frontend quality across user journeys, a11y, visual regressions, and
performance targets.
Required Workflow
- Set up Playwright for E2E critical journeys (login, checkout, form submit, navigation).
- Configure unit/component tests with Vitest + Testing Library (or Jest + Testing Library).
- Run accessibility audits:
- axe-core via
@axe-core/playwright
- Lighthouse CI for performance, SEO, accessibility
- Run visual regression tests with Percy or Chromatic.
- Verify page load under 3 seconds on 4G, Lighthouse performance score >= 80, and no console errors.
- Check missing alt tags, color contrast, and keyboard navigation.
- Output
frontend-test-report.json with Lighthouse scores and pass/fail counts.
Execution
python skills/web-frontend-tester/scripts/frontend_tester.py --input <workspace> --output <out.json> --format json
References