Execute qualquer Skill no Manus
com um clique

Execute qualquer Skill no Manus com um clique

tdd-frontend

Estrelas1

Forks0

Atualizado18 de maio de 2026 às 00:31

Implement a Next.js component or page using TDD with Jest, React Testing Library, and Playwright for PlaylistMiner frontend.

Instalação

Instalar com Codex ou Claude Copie este prompt, cole no Codex, Claude ou outro assistente e deixe que ele revise a página da skill e instale para você.

Executar no Manus

Fonte

ManikantaR

ManikantaR/playlistminer

Abrir repositório GitHub Ver repositórios do creator

Download

Executar no Manus

Ocupações relacionadasSOC

Baseado na classificação ocupacional SOC

Desenvolvedores webInformática e Matemática·SOC 15-1254

SKILL.md

readonly

name	tdd-frontend
description	Implement a Next.js component or page using TDD with Jest, React Testing Library, and Playwright for PlaylistMiner frontend.

TDD Feature Implementation (Next.js)

Implement the requested component or page using TDD.

Step 1: Write Jest Test

Create test file alongside the component: ComponentName.test.tsx
Use React Testing Library: render, screen, userEvent
Test rendering, user interactions, edge cases
Run npm test in src/web/ — confirm tests FAIL

Step 2: Implement Component

Write minimal component to pass tests
TypeScript strict — no any types
Use TanStack Query for API calls via custom hooks in hooks/
Tailwind CSS only — no custom CSS
Server components by default, "use client" only for interactivity
Run npm test — confirm tests PASS

Step 3: E2E Test (for pages)

Add Playwright test in src/web/e2e/ for the user flow
Test the happy path end-to-end
Run npm run test:e2e

Rules

API calls go through hooks, never directly in components
All hooks use the auto-generated OpenAPI client
Check dark mode rendering
Check responsive layout at mobile width

Mais deste repositório

mesmo repositório

categorization-debug

ManikantaR/playlistminer

Debug why a PlaylistMiner video was categorized incorrectly or not categorized, by tracing through all 3 pipeline layers.

2026-05-181

ef-migration

ManikantaR/playlistminer

Create or modify an EF Core migration for PlaylistMiner database schema changes, with review and verification steps.

2026-05-181

tdd-dotnet

ManikantaR/playlistminer

Implement a .NET feature using strict Red-Green-Refactor TDD with xUnit, FluentAssertions, and Moq for PlaylistMiner backend.

2026-05-181

categorization-debug

ManikantaR/playlistminer

Debug why a video was categorized incorrectly or not categorized at all in PlaylistMiner.

2026-05-181

ef-migration

ManikantaR/playlistminer

Create or modify an Entity Framework Core migration for PlaylistMiner database schema changes.

2026-05-181

tdd-dotnet

ManikantaR/playlistminer

Write a new feature using Red-Green-Refactor TDD with xUnit and FluentAssertions for PlaylistMiner .NET backend.

2026-05-181

name	tdd-frontend
description	Implement a Next.js component or page using TDD with Jest, React Testing Library, and Playwright for PlaylistMiner frontend.

TDD Feature Implementation (Next.js)

Implement the requested component or page using TDD.

Step 1: Write Jest Test

Create test file alongside the component: ComponentName.test.tsx
Use React Testing Library: render, screen, userEvent
Test rendering, user interactions, edge cases
Run npm test in src/web/ — confirm tests FAIL

Step 2: Implement Component

Write minimal component to pass tests
TypeScript strict — no any types
Use TanStack Query for API calls via custom hooks in hooks/
Tailwind CSS only — no custom CSS
Server components by default, "use client" only for interactivity
Run npm test — confirm tests PASS

Step 3: E2E Test (for pages)

Add Playwright test in src/web/e2e/ for the user flow
Test the happy path end-to-end
Run npm run test:e2e

Rules

API calls go through hooks, never directly in components
All hooks use the auto-generated OpenAPI client
Check dark mode rendering
Check responsive layout at mobile width