Use when adding new error messages to React, or seeing "unknown error code" warnings.
npx skills add TheSimpleApp/agent-skills --skill "tdd"
Install specific skill from multi-skill repository
# Description
Test-driven development workflow. Write tests first, then implement. Use when building new features, fixing bugs, or refactoring code.
# SKILL.md
name: tdd
description: Test-driven development workflow. Write tests first, then implement. Use when building new features, fixing bugs, or refactoring code.
license: MIT
metadata:
author: thesimpleapp
version: "1.0"
Test-Driven Development
Write tests first, then implement the minimum code to pass them.
The TDD Cycle
1. RED → Write a failing test
2. GREEN → Write minimum code to pass
3. REFACTOR → Clean up while keeping tests green
Workflow
Step 1: Understand the Requirement
- What behavior are we implementing?
- What are the inputs and expected outputs?
- What are the edge cases?
Step 2: Write the Test First
// Example: Testing a function that validates email
describe('validateEmail', () => {
it('returns true for valid email', () => {
expect(validateEmail('[email protected]')).toBe(true);
});
it('returns false for missing @', () => {
expect(validateEmail('userexample.com')).toBe(false);
});
it('returns false for empty string', () => {
expect(validateEmail('')).toBe(false);
});
});
Step 3: Run Test (Confirm it Fails)
The test MUST fail before you write implementation. If it passes, either:
- The feature already exists
- The test is wrong
Step 4: Write Minimum Implementation
Only write enough code to make the test pass. Resist the urge to add "extra" logic.
Step 5: Refactor
- Remove duplication
- Improve naming
- Extract functions if needed
- Run tests after each change
Test Types
| Type | Purpose | Speed |
|---|---|---|
| Unit | Single function/component | Fast |
| Integration | Multiple components together | Medium |
| E2E | Full user flows | Slow |
Best Practices
Good Tests Are:
- Fast - Run in milliseconds
- Isolated - Don't depend on other tests
- Repeatable - Same result every time
- Self-validating - Pass or fail, no manual checking
- Timely - Written before or with the code
Test Naming
Use descriptive names that explain the behavior:
✓ "returns empty array when no items match filter"
✗ "test1" or "filterTest"
Arrange-Act-Assert Pattern
it('calculates total with discount', () => {
// Arrange
const cart = new Cart();
cart.addItem({ price: 100 });
cart.applyDiscount(0.1);
// Act
const total = cart.getTotal();
// Assert
expect(total).toBe(90);
});
When to Skip TDD
TDD works best for logic-heavy code. Consider skipping for:
- Exploratory prototypes (but add tests before merging)
- Pure UI layout (use visual testing instead)
- One-off scripts
Commands
Run tests continuously:
npm test -- --watch
# or
pytest --watch
# Supported AI Coding Agents
This skill is compatible with the SKILL.md standard and works with all major AI coding agents:
Learn more about the SKILL.md standard and how to use these skills with your preferred AI coding agent.