Install
$ agentstack add skill-sukirman1901-frontend-expert-frontend-testing ✓ scanned · ✓ verified, works with Claude Code, Cursor, and more.
Security review
✓ PassedNo issues found. Passed automated security review. · v0.1.0 How review works →
- ✓ Prompt-injection patterns
- ✓ Secret / credential exfiltration
- ✓ Dangerous shell & filesystem operations
- ✓ Untrusted network calls
- ✓ Known-malicious package signatures
What it can access
- ✓ Network access No
- ✓ Filesystem access No
- ✓ Shell / process execution No
- ✓ Environment & secrets No
- ✓ Dynamic code execution No
From automated source analysis of v0.1.0. “Used” means the capability is present in the source — more access means more to trust, not that it’s unsafe.
Verified badge
Passed review? Show it. Paste this badge into your README, it links to the public security report.
Reliability & compatibility
Declared compatibility
Compatibility is declared by the source manifest. End-to-end runtime verification is coming, see below.
We're building live execution health for every listing: tool-call success rate, median latency, uptime, and last-checked timestamps, measured, not self-reported. It isn't live yet, so we don't show numbers we can't stand behind.
How agent discovery & health will work →About
Frontend Testing
Overview
Prove UI behavior with a lean pyramid: mostly unit/component tests, some integration, few E2E. Prefer Testing Library queries that mirror how users interact. Include accessibility checks for interactive UI.
When to Use
/test-uior explicit test requests- After
/uiwhen the user wants TDD or coverage for a component - Fixing a UI bug (regression test first)
Workflow
- Choose level
- Unit/component (~80%): render, props, states (loading/error/empty)
- Integration (~15%): user flows across a few components
- E2E (~5%): critical paths only (Playwright/Cypress)
- TDD when changing behavior
- Red → Green → Refactor
- One behavior per test; name by user-visible outcome
- Query priority (Testing Library)
- Prefer: role, label, text
- Avoid: test IDs unless no accessible name exists
- Must cover for interactive UI
- Default render
- Loading / error / empty when those states exist
- Primary user action (click/submit)
- Keyboard path for custom controls when non-native
- Robustness (when risk is real): double-submit / spam click, interrupt open→close mid-animation, slow network loading UI
- Accessibility in tests
- axe-core (or equivalent) on critical components when tooling exists
- Assert accessible names on icon-only controls
- Visual regression (optional)
- Storybook + Chromatic/Percy when the project already uses them
- Do not introduce a visual stack just for this skill
Checklist
- [ ] Tests describe user-visible behavior
- [ ] Loading / error / empty covered when applicable
- [ ] Double-submit / interrupt paths covered when destructive or async
- [ ] No unnecessary
test-idqueries - [ ] Regression test for bugs fixed
- [ ] A11y assertion or axe run for interactive surfaces (when tooling available)
Depth
Full guide: references/testing.md. Robustness ideas also in references/anti-patterns.md.
Source & license
This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.
- Author: sukirman1901
- Source: sukirman1901/frontend-expert
- License: MIT
- Homepage: https://github.com/sukirman1901/frontend-expert
Install and usage instructions live in the source repository linked above.
Reviews
No reviews yet, be the first.
Write a review
Versions
- v0.1.0 Imported from the upstream source.