frontend-test
About
This skill automatically generates React/Vue component tests (unit, snapshot, e2e) when developers request component testing. It creates test files using React Testing Library that validate rendering, user interactions, and accessibility. The skill triggers on phrases like "test this component" or "write component test" and follows RTL best practices.
Quick Install
Claude Code
Recommended/plugin add https://github.com/alekspetrov/navigatorgit clone https://github.com/alekspetrov/navigator.git ~/.claude/skills/frontend-testCopy and paste this command in Claude Code to install this skill
Documentation
Frontend Test Generator
Generate React/Vue component tests with React Testing Library including user interactions.
When to Invoke
Auto-invoke when user mentions:
- "Test this component"
- "Write component test"
- "Test component"
- "Add component test"
- "Component tests for [name]"
What This Does
- Generates test file with RTL utilities
- Tests component rendering
- Tests user interactions (click, type, etc.)
- Tests accessibility
- Generates snapshot tests
Success Criteria
- Test file generated with RTL imports
- Tests render component correctly
- User interactions are tested
- Accessibility attributes validated
- Tests follow React Testing Library best practices
Auto-invoke when writing frontend component tests ⚛️
GitHub Repository
Related Skills
evaluating-llms-harness
TestingThis Claude Skill runs the lm-evaluation-harness to benchmark LLMs across 60+ standardized academic tasks like MMLU and GSM8K. It's designed for developers to compare model quality, track training progress, or report academic results. The tool supports various backends including HuggingFace and vLLM models.
webapp-testing
TestingThis Claude Skill provides a Playwright-based toolkit for testing local web applications through Python scripts. It enables frontend verification, UI debugging, screenshot capture, and log viewing while managing server lifecycles. Use it for browser automation tasks but run scripts directly rather than reading their source code to avoid context pollution.
finishing-a-development-branch
TestingThis skill helps developers complete finished work by verifying tests pass and then presenting structured integration options. It guides the workflow for merging, creating PRs, or cleaning up branches after implementation is done. Use it when your code is ready and tested to systematically finalize the development process.
go-test
MetaThe go-test skill provides expertise in Go's standard testing package and best practices. It helps developers implement table-driven tests, subtests, benchmarks, and coverage strategies while following Go conventions. Use it when writing test files, creating mocks, detecting race conditions, or organizing integration tests in Go projects.
