add-test
Scaffold a test for a Tailwind utility or Nativewind feature following the project's testing conventions.
Best use case
add-test is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Scaffold a test for a Tailwind utility or Nativewind feature following the project's testing conventions.
Teams using add-test should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/add-test/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How add-test Compares
| Feature / Agent | add-test | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Scaffold a test for a Tailwind utility or Nativewind feature following the project's testing conventions.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
Related Guides
AI Agents for Coding
Browse AI agent skills for coding, debugging, testing, refactoring, code review, and developer workflows across Claude, Cursor, and Codex.
AI Agents for Marketing
Discover AI agents for marketing workflows, from SEO and content production to campaign research, outreach, and analytics.
AI Agents for Startups
Explore AI agent skills for startup validation, product research, growth experiments, documentation, and fast execution with small teams.
SKILL.md Source
## Context
Nativewind v5 tests live in `src/__tests__/` and use the `renderCurrentTest()` helper from `src/test-utils.tsx`.
## Convention
The test name IS the className being tested. `renderCurrentTest()` auto-extracts it:
```typescript
import { renderCurrentTest } from "../test-utils";
describe("Feature Name", () => {
test("class-name", async () => {
expect(await renderCurrentTest()).toStrictEqual({
props: {
style: { /* expected RN style */ },
},
});
});
});
```
For custom utilities that map to non-style props (like `elevation`, `tint`, `ripple`), the expected output includes those props directly:
```typescript
test("elevation-sm", async () => {
expect(await renderCurrentTest()).toStrictEqual({
props: {
style: { elevation: 3 },
},
});
});
```
## Steps
1. **Identify the feature**: What CSS class or Nativewind feature needs testing? Use `$ARGUMENTS` as the starting point.
2. **Find existing tests**: Search `src/__tests__/` for similar tests to understand the pattern and where the new test should go.
3. **Determine expected output**: Figure out what React Native style the CSS class should produce. Check Tailwind docs, theme.css, and the react-native-css compiler if needed.
4. **Write the test**: Follow the exact convention above. Place it in the appropriate existing test file, or create a new one if it's a new category.
5. **Run the test**: Execute `yarn test` to verify it passes.Related Skills
debug-nw
Debug a Nativewind v5 setup issue. Walks through common configuration problems with metro, babel, postcss, and dependencies.
triage
Triage a Nativewind or react-native-css GitHub issue. Reads the issue, determines version/repo, creates a reproduction, tests against latest published and local HEAD, then drafts a comment.
architecture
Explain the Nativewind v5 architecture, CSS pipeline, and key files. Use when a contributor wants to understand how the codebase works.
javascript-testing-patterns
Comprehensive guide for implementing robust testing strategies in JavaScript/TypeScript applications using modern testing frameworks and best practices.
e2e-testing-patterns
Build reliable, fast, and maintainable end-to-end test suites that provide confidence to ship code quickly and catch regressions before users do.
backtester
Professional backtesting framework for trading strategies. Tests SMA crossover, RSI, MACD, Bollinger Bands, and custom strategies on historical data. Generates equity curves, drawdown analysis, and performance metrics.
pentest-c2-operator
Set up authorized C2 simulation workflows and measure defensive detection outcomes.
pentest-auth-bypass
Test authentication and session management controls for bypass and account takeover scenarios.
pentest-api-attacker
Test APIs against OWASP API Security Top 10 including discovery, auth abuse, and protocol-specific checks.
pentest-active-directory
Assess Active Directory identity attack paths including roasting, relay, and delegation abuse.
nmap-pentest-scans
Plan and orchestrate authorized Nmap host discovery, port and service enumeration, NSE profiling, and reporting artifacts for in-scope targets.
evalview-agent-testing
Regression testing for AI agents using EvalView. Snapshot agent behavior, detect regressions in tool calls and output quality, and block broken agents before production.