Programming · Testing

testing-react

/testing-react

Stratégie de Tests React 19.3 + Compiler 1.0. Use when writing tests, reviewing test coverage, or setting up testing.

For whom

Author: TheBeardedBearSAS ↗
Repository: claude-craft ↗
Licence: MIT
Last repository change: 27.10.2026

Download .zip

Paczka: 2 pliki, LICENCJA-REPOZYTORIUM.txt i ZRODLO.txt z adresem źródła · 4 KB · SHA-256 8a5c2bcbbe190f29…

Connect Claude to the library’s MCP server: https://sokolinski.com/skille/en/mcp (instructions).
Ask Claude: Install skill testing-react-10cf29
Claude will show the score, risks and files, then save the skill with your consent.

In your terminal: curl -L https://sokolinski.com/skille/en/pobierz/testing-react-10cf29 -o skill.zip && unzip skill.zip -d ~/.claude/skills/
For a single project, extract to .claude/skills/ inside the project directory.
Restart Claude Code and enter /testing-react.

Assessment and security

90/ 100Class: good

Format25 / 25

Frontmatter with name and description, valid name, description up to 1,024 characters, name matching the folder.

Discoverability25 / 25

Description explains when to use the skill, has a reasonable length and uses third person.

Content25 / 35

At least 150 words and at most 500 lines, headings, step lists, examples or code.

Hygiene15 / 15

No placeholders such as TODO, no Windows paths, with a licence.

Riskno signals detected in the scan

Files in this package: 2
Scripts: 0
HTML comments: 0
URLs in SKILL.md: 4

Deprecation

No signals detected. Repository changed on 27.10.2026, without references to retired models or APIs.

Licence

MIT, open: use and modify while retaining author attribution.

What it does and when to use it

Stratégie de Tests React 19.3 + Compiler 1.0. Use when writing tests, reviewing test coverage, or setting up testing.

Original author description

Stratégie de Tests React 19.3 + Compiler 1.0. Use when writing tests, reviewing test coverage, or setting up testing.

How it works

Stack recommandée 2026
Invariants non-négociables
Checklist par type

Original SKILL.md headings · 44 lines, 336 words

SKILL.md preview

---
name: testing-react
description: Stratégie de Tests React 19.3 + Compiler 1.0. Use when writing tests, reviewing test coverage, or setting up testing.
context: fork
---

# Stratégie de Tests React 19 + Compiler 1.0

**Versions :** React 19.2+ | React Compiler 1.0 | Vitest 5 | Playwright

React Compiler 1.0 (auto-memoization) est transparent pour les tests — tester le comportement visible, jamais les optimisations internes.

## Stack recommandée 2026

| Type | Outil | Usage |
|------|-------|-------|
| **Unit/Composants** | **Vitest 5** Browser Mode | Chromium/Firefox/WebKit natif |
| **Composants (navigateur)** | **vitest-browser-react** | `render` + locators, intégré à Vitest Browser Mode |
| **Component Testing** | **Playwright CT** | Alternative à RTL — browser réel |
| **Composants (JSDOM)** | **React Testing Library 16** | Toujours maintenu — pertinent pour les suites JSDOM existantes |
| **E2E** | **Playwright** | Flows utilisateur complets |
| **Mutation** | **Stryker** | Qualité des tests (score >= 80%) |
| **Property-based** | **fast-check** | Génération de cas de test |

Privilégier un vrai navigateur (Vitest Browser Mode, Playwright CT) plutôt que JSDOM (lourd, incomplet). React Testing Library 16 reste maintenu : l'utiliser pour les suites JSDOM existantes, ne pas migrer sans bénéfice.

**Sources :** [Vitest Browser Mode](https://vitest.dev/guide/browser/), [vitest-browser-react](https://github.com/vitest-community/vitest-browser-react), [Playwright Component Testing](https://playwright.dev/docs/test-components), [Stryker Mutator](https://stryker-mutator.io/)

## Invariants non-négociables

- Vitest Browser Mode (provider: playwright) pour les nouveaux tests composants — éviter JSDOM
- Tester le comportement (ce que voit l'utilisateur), pas l'implémentation
- Ne jamais tester les optimisations du React Compiler (memoization)
- Mutation score >= 80% via Stryker avant merge
- Vitest `projects` pour monorepos (unit / browser séparés) — `workspace` est déprécié
- MSW pour mocker les appels API (pas de `fetch` mockée à la main)

## Checklist par type

| Type | Vérification |
|------|-------------|
| Composant | Vitest Browser Mode ou Playwright CT, interactions réelles |
| Hook | Vitest, `renderHook` si nécessaire |
| RSC | Test du rendu HTML retourné (pas de DOM) |
| E2E | Playwright, flows complets avec `expect().toHaveURL()` |
| Mutation | `npx stryker run`, seuil break >= 50, high >= 80 |

> Détails complets, exemples de code, configs et checklists : voir [REFERENCE.md](./REFERENCE.md)

Files in this package (2)

REFERENCE.md 4 KB
SKILL.md 3 KB

Versions

Repository	Score	Licence
This page · TheBeardedBearSAS/claude-craft	90	MIT
iliaal/whetstone	100	MIT

Database snapshot: 13.11.2026 · package version 8a5c2bcbbe19 (SHA-256 digest of the entire package)

Downloads in the last 30 days: 0 · ranking

Report a problem with this skill: harmful content, incorrect descriptions or an author’s removal request.

Similar skills

90testing-symfony
Stratégie de Tests Symfony 8.1 / PHP 8.5. Use when writing tests, reviewing test coverage, or setting up testing.
90testing-python
Stratégie de Tests Python 3.14+. Use when writing tests, reviewing test coverage, or setting up testing.
100senior-qa
Testing for React/Next.js with Jest, React Testing Library, and Playwright. Use when generating tests, writing unit tests, analyzing coverage, scaffolding E2E tests, configuring Jest, or improving test quality.
100webapp-testing
Playwright E2E patterns, Testing Library component tests, test selectors. Use when writing browser tests, component tests, or setting up an E2E testing pipeline for a Next.js or React app.
100react-native-testing
Test React Native components with Jest and React Native Testing Library. Use when writing Jest or React Native Testing Library tests for React Native components.
100testing
Apply comprehensive testing best practices including unit, integration, and e2e tests. Use when writing tests, reviewing test coverage, designing testable code, or setting up test infrastructure.