skills/dev-workflow/tdd-red-green-refactor/SKILL.md
Enforces a disciplined Red-Green-Refactor (TDD) workflow in TypeScript/Node.js. Use this whenever creating new features, fixing bugs, or migrating logic to ensure high-quality, verifiable implementations.
npx skillsauth add The-Utopia-Studio/skills tdd-red-green-refactorInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
This skill implements a structural framework for AI-assisted programming to ensure every line of code is verifiable, typed, and purposeful.
You must prove the feature does not exist and that your test is valid.
ReferenceError: add is not defined) and not a configuration error.Make the test pass as quickly and simply as possible.
Improve the code structure while maintaining the "Green" state.
You are strictly forbidden from writing a large "splurge" of multiple tests at once. You must follow a strictly incremental loop:
Use automated assertions and strong typing (TypeScript) as backpressure to prevent the AI from "guessing" the solution or "playing in the mud" with low-quality code.
Never modify an existing test to make a failing implementation pass. If a test must change, it must be because the requirement changed, not because the code is difficult to write.
Step 1: Red
// math.test.ts
import { describe, it, expect } from 'vitest';
import { add } from './math';
describe('add', () => {
it('should sum two numbers', () => {
expect(add(2, 2)).toBe(4); // Fails: ReferenceError: add is not defined
});
});
Step 2: Green
// math.ts
export const add = (a: any, b: any) => {
return 4; // Passes: Minimal code to satisfy the test
};
Step 3: Refactor
// math.ts
/**
* Sums two numbers with explicit type safety.
*/
export const add = (a: number, b: number): number => {
return a + b; // Passes: Proper implementation with safety net
};
data-ai
Raw mechanical interfaces fusing Swiss typographic print with military terminal aesthetics. Rigid grids, extreme type scale contrast, utilitarian color, analog degradation effects. For data-heavy dashboards, portfolios, or editorial sites that need to feel like declassified blueprints.
development
Teaches the AI to design like a high-end agency. Defines the exact fonts, spacing, shadows, card structures, and animations that make a website feel expensive. Blocks all the common defaults that make AI designs look cheap or generic.
development
Overrides default LLM truncation behavior. Enforces complete code generation, bans placeholder patterns, and handles token-limit splits cleanly. Apply to any task requiring exhaustive, unabridged output.
development
Senior UI/UX Engineer. Architect digital interfaces overriding default LLM biases. Enforces metric-based rules, strict component architecture, CSS hardware acceleration, and balanced design engineering.