Skills
.Work. You
Rest

component-tester

Official

Automate component testing, ensure code quality.

Software Engineering#code quality#development workflow#React#frontend#Vitest#test coverage#component testing
Authorsgcarstrends
Version1.0.0
Installs0

System Documentation

What problem does it solves? This Skill automates the tedious process of running Vitest tests for React components, ensuring code quality and maintaining test coverage without manual command execution, allowing developers to focus on building.

Core Features & Use Cases

  • Automated Test Execution: Automatically runs relevant Vitest tests when a component is created or modified, saving manual effort.
  • Coverage Reporting: Provides detailed test coverage percentages (statements, branches, functions, lines) and identifies gaps, ensuring high code quality.
  • Clear Feedback: Reports pass/fail status, error messages for failing tests, and coverage issues directly, streamlining debugging.
  • Use Case: After making changes to src/app/blog/_components/progress-bar.tsx, activate this Skill. It will automatically run pnpm test -- src/app/blog/_components/progress-bar, report if all tests pass, and show the coverage, ensuring your changes haven't introduced regressions or reduced quality.

Quick Start

Run Vitest tests for the 'UserAvatar' component located at 'src/components/user-avatar.tsx' and report coverage.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: component-tester
Download link: https://github.com/sgcarstrends/sgcarstrends/archive/main.zip#component-tester

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.