component-testing

Write Vitest unit tests for Laylder lib code following AAA patterns.

Updated Nov 11, 2025
One-click install
npx skills add https://github.com/jhlee0409/laylder --skill component-testing
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: component-testing
Source: https://github.com/jhlee0409/laylder/tree/main/.claude/skills/component-testing
Command: npx skills add https://github.com/jhlee0409/laylder --skill component-testing

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a structured approach to writing Vitest-based unit tests for Laylder, ensuring AAA testing standards, coverage, and maintainability.

Core Features & Use Cases

  • Test Skeletons & Patterns: Create test templates following AAA (Arrange-Act-Assert).
  • Coverage & Quality: Emphasize high test coverage and meaningful assertions.
  • Schema & Canvas Tests: Support tests for schemas, utilities, and canvas behavior.

Quick Start

Create a new Vitest test file for a lib module, following the project's testing conventions.

Frequently Asked Questions about component-testing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I write unit tests for JavaScript functions using Vitest?

Vitest-based unit tests follow the AAA (Arrange-Act-Assert) pattern: set up your test data, execute the function, then verify the output. This Skill provides templates and conventions for writing comprehensive tests for lib/ functions, schema validation, canvas utilities, and business logic with high coverage and meaningful assertions.

What is the AAA pattern and why use it for component testing?

The AAA pattern structures tests into three phases: Arrange (set up data), Act (call the function), and Assert (check results). This makes tests readable, maintainable, and easier to debug. It's the standard convention for this project's test suite, ensuring consistency across all unit tests.

How do I add test coverage to schema validation and canvas utilities?

Create Vitest test files that validate schema behavior and canvas utility functions by following project naming conventions and file structure. The Skill provides test templates for schema validation logic and canvas behavior, helping you achieve high coverage and catch regressions early.

Can I use Vitest to write regression tests after fixing bugs?

Yes. Vitest supports writing regression tests that verify a bug fix works and prevent the issue from recurring. This Skill covers creating regression tests within the project's testing framework, following AAA patterns and existing test conventions to maintain quality standards.

What file structure and naming conventions should I follow for unit tests?

This Skill enforces the project's specified file structure and naming conventions for test files, ensuring consistency across the codebase. Following these conventions makes tests discoverable, maintainable, and aligned with team standards.

How do I write performance tests with Vitest?

Performance tests verify that functions meet speed and efficiency requirements. This Skill includes guidance on creating performance tests for lib/ functions using Vitest, following project conventions and the AAA pattern to measure and validate behavior under load.