skills.rest
jjmendezrodriguez
jjmendezrodriguezCOMMUNITY
Explore all skills by this author →
GitHub

code-test

Write AAA-structured Vitest tests for React, hooks, and mocked Supabase queries.

Updated Apr 16, 2026
Search Tags:#vitest#integration-tests#react-testing-library#user-event#supabase-mocking#zod-testing
One-click install
npx skills add https://github.com/jjmendezrodriguez/jm-claude-plugin --skill code-test-jjmendezrodriguez
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: code-test
Source: https://github.com/jjmendezrodriguez/jm-claude-plugin/tree/main/skills/code-test
Command: npx skills add https://github.com/jjmendezrodriguez/jm-claude-plugin --skill code-test-jjmendezrodriguez

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Testing code that touches Supabase, React components, hooks, and service logic is easy to get wrong, leading to brittle suites, flaky behavior, and unverified edge cases.

Core Features & Use Cases

  • Testing priority that maximizes ROI: start with pure utils and Zod schemas, then move to services, hooks, components, and finally API/Supabase integrations.
  • Vitest best practices for reliable outcomes: use clear AAA (Arrange/Act/Assert) structure, descriptive test names, and keep tests independent.
  • React Testing Library approach: query by role and label first to validate user-facing behavior rather than internal implementation.
  • Supabase mocking strategy: mock the Supabase client module and control resolved values to test business logic deterministically.
  • Hook and component behavior testing: validate hook state transitions via renderHook and simulate user flows with userEvent.

Quick Start

Ask the skill: "I need to add unit or integration tests for this new hook/service/component—what should I test first, how should the test be structured, and how do I mock Supabase for deterministic assertions?"

Frequently Asked Questions about code-test

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

FAQPage Schema
How do I write reliable Vitest tests for React hooks and components?▼

Reliable Vitest tests for React hooks and components use AAA structure, renderHook for state transitions, and userEvent to simulate user flows, validating behavior rather than internal implementation.

What's the best way to mock Supabase queries for deterministic integration tests?▼

Mocking Supabase queries deterministically involves mocking the Supabase client module and controlling resolved values to test business logic, ensuring isolation rules prevent shared state and flaky behavior.

How do I test Zod validation schemas and pure utilities in Vitest?▼

Testing Zod validation schemas and pure utilities in Vitest maximizes ROI by starting with these isolated logic units before moving to services, hooks, components, and API integrations.

Why does my React Testing Library suite break when I refactor components?▼

React Testing Library suites break during refactoring when tests query by internal implementation details; querying by role and label first validates user-facing behavior and prevents brittle tests.

Can I use user-event and React Testing Library with Vitest for integration testing?▼

Yes, you can use user-event and React Testing Library with Vitest to simulate user flows and validate component behavior deterministically within an isolated testing environment.

What testing priority should I follow when adding features to a Supabase application?▼

Testing priority for Supabase applications starts with pure utils and Zod schemas, then moves to services, hooks, components, and finally API and Supabase integrations to maximize ROI.

Related Skills

Explore More Software Engineering Skills→
mikemylmikemyl
1

front-end-testing

Automate React UI component tests with Vitest Browser Mode and DOM Testing Library.

Community
Intermediate
dtabordadtaborda

contract-testing

Validate JSON contract fixtures against Zod schemas with Vitest.

Community
Intermediate
PlazaCCPlazaCC
2

new-trpc-router

Create tRPC v11 routers with Zod validation and register them in appRouter.

Official
Intermediate
pluginagentmarketplacepluginagentmarketplace
1

react-testing-library

Write RTL-based React component tests with MSW and Jest.

Community
Intermediate