react-expert

React Expert Research Skill

Overview

This skill produces exhaustive documentation research on any React API or concept by searching authoritative sources (tests, source code, PRs, issues) rather than relying on LLM training knowledge.

Red Flags - STOP if you catch yourself thinking:

• "I know this API does X" → Find source evidence first
• "Common pattern is Y" → Verify in test files
• Generating example code → Must have source file reference

Invocation

/react-expert useTransition
/react-expert suspense boundaries
/react-expert startTransition

Sources (Priority Order)

1. React Repo Tests - Most authoritative for actual behavior
2. React Source Code - Warnings, errors, implementation details
3. Git History - Commit messages with context
4. GitHub PRs & Comments - Design rationale (via gh CLI)
5. GitHub Issues - Confusion/questions (react/react + reactjs/react.dev)
6. React Working Group - Design discussions for newer APIs
7. Flow Types - Source of truth for type signatures
8. TypeScript Types - Note discrepancies with Flow
9. Current react.dev docs - Baseline (not trusted as complete)

No web search - No Stack Overflow, blog posts, or web searches. GitHub API via gh CLI is allowed.

Workflow

Step 1: Setup React Repo

First, ensure the React repo is available locally:

# Check if React repo exists, clone or update
if [ -d ".claude/react" ]; then
  cd .claude/react && 

Get the current commit hash for the research document:

Step 2: Dispatch 6 Parallel Research Agents

Spawn these agents IN PARALLEL using the Task tool. Each agent receives the skepticism preamble:

"You are researching React's <TOPIC>. CRITICAL: Do NOT rely on your prior knowledge about this API. Your training may contain outdated or incorrect patterns. Only report what you find in the source files. If your findings contradict common understanding, explicitly highlight this discrepancy."

Step 3: Agent Prompts

Use these exact prompts when spawning agents:

test-explorer

You are researching React's <TOPIC>.
 
CRITICAL: Do NOT rely on your prior knowledge about this API. Your training may contain outdated or incorrect patterns. Only report what you find in the source files.
 
Your task: Find test files in .claude/react that demonstrate <TOPIC> usage.
 
1. Search for test files: Glob for `**/__tests__/**/*<topic>*` and `**/__tests__/**/*.js` then grep for <topic>
2. For each relevant test file, extract:
   - The test description (describe/it blocks)
   - The actual usage code
   - Any assertions about behavior
   - Edge cases being tested
3. Report findings with exact file paths and line numbers
 
Format your output as:
## Test File: <path>
### Test: "<test description>"
```javascript
<exact code from test>

Behavior:

 
#### source-explorer

You are researching React's .

CRITICAL: Do NOT rely on your prior knowledge about this API. Only report what you find in the source files.

Your task: Find warnings, errors, and implementation details for .

1. Search .claude/react/packages/*/src/ for:
   • console.error mentions of
   • console.warn mentions of
   • Error messages mentioning
   • The main implementation file
2. For each warning/error, document:
   • The exact message text
   • The condition that triggers it
   • The source file and line number

Format your output as:

Warnings & Errors

Implementation Notes

git-historian

pr-researcher

issue-hunter

types-inspector

You are researching React's <TOPIC>.
 
CRITICAL: Do NOT rely on your prior knowledge. Only report what you find in type definitions.
 
Your task: Find and compare Flow and TypeScript type signatures for <TOPIC>.
 
1. Flow types (source of truth): Search .claude/react/packages/*/src/*.js for @flow annotations related to <topic>
2. TypeScript types: Search .claude/react/packages/*/index.d.ts and @types/react
3. Compare and note any discrepancies
 
Format your output as:
## Flow Types (Source of Truth)
**File:** <path>
```flow
<exact type definition>

TypeScript Types

File:

<exact type definition>

Discrepancies

Step 4: Synthesize Results

After all agents complete, combine their findings into a single research document.

DO NOT add information from your own knowledge. Only include what agents found in sources.

Step 5: Save Output

Write the final document to .claude/research/<topic>.md

Replace spaces in topic with hyphens (e.g., "suspense boundaries" → "suspense-boundaries.md")

Output Document Template

Common Mistakes to Avoid

1. Trusting prior knowledge - If you "know" something about the API, find the source evidence anyway
2. Generating example code - Every code example must come from an actual source file
3. Skipping agents - All 6 agents must run; each provides unique perspective
4. Summarizing without sources - Every claim needs a file:line or PR/issue reference
5. Using web search - No Stack Overflow, no blog posts, no social media

Verification Checklist

Before finalizing the research document:

• React repo is at .claude/react with known commit hash
• All 6 agents were spawned in parallel
• Every code example has a source file reference
• Warnings/errors table has source locations
• No claims made without source evidence
• Discrepancies between Flow/TS types documented
• Source links section is complete