Rn Write Tests

rn-write-tests — Jest + RNTL + Maestro testing for Expo + RN

Contract

See references/contracts.md (vendored from dev-flow). Key facts:

• Reads /.workflow/meta.json#stack.framework — must be "expo-rn".
• Adds dev dependencies + Jest config on first call (idempotent: detects existing setup).
• Writes test files under /__tests__/ (Jest convention) for unit/integration.
• Writes Maestro YAML flows under /.maestro/ for e2e.
• Does NOT modify meta.json#phase.

When this skill applies

• User asks to write a test for a specific source file or flow.
• Orchestrator does NOT route here automatically — test writing is on-demand.

Knowledge dependencies (read these first)

• rn-fundamentals/SKILL.md — TS strict, modern primitives the tests will see.
• rn-data-fetching/references/patterns.md — query/mutation patterns the tests must exercise.

Workflow

Step 1 — Verify preconditions

Read .workflow/meta.json. Abort if stack.framework != "expo-rn".

Step 2 — Detect / install the test stack

Check if jest, jest-expo, @testing-library/react-native are in package.json. If not:

npx expo install --dev \
  jest jest-expo \
  @testing-library/react-native \
  @testing-library/jest-native \
  @types/jest -- --legacy-peer-deps

(See references/jest-setup.md for the full config.)

For Maestro: detect .maestro/ directory. If missing AND user wants e2e, see references/maestro-setup.md (manual install, not npm).

Step 3 — Choose what to test

Ask the user (one round-trip) what to test:

• Component (renders, props, interactions) → RNTL.
• Hook (useQuery, useMutation, custom hook) → RNTL renderHook.
• Pure function (utility, helper) → plain Jest.
• e2e flow (sign-in, navigation, form submit) → Maestro.

If the file under test is lib/api.ts, write a Jest test of the function with fetch mocked. If the file under test is app/(auth)/sign-in.tsx, write an RNTL test of the screen + a Maestro flow of the user journey.

Step 4 — Write the test

Use the canonical patterns from references/rntl-patterns.md (or references/jest-setup.md for utilities, or references/maestro-setup.md for e2e).

Test files:

• Unit/integration: __tests__/.test.tsx (or .test.ts for non-JSX).
• e2e: .maestro/.yaml.

Step 5 — Run the test

cd  && npm test -- --runInBand --bail

(For Maestro: maestro test .maestro/.yaml.)

Test MUST pass. If it doesn't:

1. Read the failure. Is it a missing mock? An assumption about the test API?
2. Fix the test (NOT the source — that's a separate task).
3. Re-run.

Step 6 — Commit

git add __tests__/.test.tsx
git commit -m "test(): cover "

Common anti-patterns (NEVER do)

• ❌ Detox — heavy, Expo Go unfriendly, requires native build. Use Maestro.
• ❌ Enzyme — abandoned. RNTL only.
• ❌ Snapshot for every component — only for stable design-system primitives.
• ❌ jest.fn() without typing the return → tests pass on wrong shape.
• ❌ Testing implementation details (state names, internal function calls) → brittle. Test user-facing behavior.
• ❌ Testing TanStack Query result shape directly → mock the queryFn instead and assert UI.
• ❌ Skipping cleanup → tests leak state. Always use RNTL's auto-cleanup (default).
• ❌ Sleeping await new Promise(r => setTimeout(r, 1000)) → use waitFor with explicit assertions.

Updating meta.json (recommended pattern)

This skill does NOT advance meta.json#phase (see Contract above) — never call set-phase. It only records the artifact and appends history, using the canonical script when available:

# Wherever dev-flow is installed (e.g. ~/.claude/skills/dev-flow/), invoke:
python3 .../dev-flow/scripts/update_meta.py  record-artifact \
    --path  --produced-by '' [--derived-from   ...]
python3 .../dev-flow/scripts/update_meta.py  append-history \
    --skill '' --inputs '{...}' --outputs '{...}' --phase-after 

The script normalizes legacy kebab-case aliases (e.g. module-added → module_added) and writes the canonical sha256 + timestamp into meta.json#artifacts. Fall back to direct JSON editing only if the script is not on PATH (and warn the user).

Sources

• Course: codewithbeto.dev/rnCourse — "Testing" module (paid, distilled).
• Official: https://callstack.github.io/react-native-testing-library/
• Official: https://docs.expo.dev/develop/unit-testing/
• Official: https://maestro.mobile.dev/

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: lukedj78
• Source: lukedj78/dev-flow
• License: MIT

Install and usage instructions live in the source repository linked above.