chore(mobile-expo): Unit tests for data layer and critical components

[Ur-imazing]

Background

The Expo watch app should have unit tests for the data layer (Experience/section mapping) and critical components so regressions are caught and behavior is documented. This issue adds those tests. Scope has been expanded to cover all 10 active section types.

Expected outcome

• Unit tests for the Experience fetch and section data layer, covering mapping logic for all 10 section types.
• Unit tests for critical UI or hooks (e.g. section renderer dispatch, nested content resolution).
• Tests run in CI (see chore for CI); no flaky or environment-dependent tests in core paths.
• E2E strategy can be documented as deferred if out of scope.

Acceptance criteria

• Data layer tests: at least one test per fetch path (watch home, experience-by-slug) or mapping logic.
• Mapping tests for each of the 10 section types: VideoHero, MediaCollection, CTA, Text, Video, BibleQuotesCarousel, RelatedQuestions, Card, Section, Container.
• Nested content tests: Section → recursive content, Container → slots → recursive content.
• MediaCollection variant tests (carousel, collection, grid, hero, player).
• SectionDispatcher tests: correct component resolved for each __typename.
• Tests run in CI (via Expo or Jest).
• README or CONTRIBUTING updated with how to run tests.

Possible solution(s)

1. Jest or Expo's test runner; mock GraphQL client in data layer tests.
2. Keep tests colocated or in __tests__ under mobile/expo.
3. Use the sample Experience (slug: easter, documentId: lr6luew6oh4hurag4n8s0ddz) as a fixture for integration-style mapping tests.

References

• Parent: epic(mobile-expo): cross-platform watch app with React Native and Expo #89
• Depends on: feat(mobile-expo): expand data layer for all 10 CMS section types #304 (expanded data layer), feat(mobile-expo): section renderers for all 10 CMS section types #93 (section renderers)
• CONTRIBUTING.md
• AGENTS.md (workflow, tests)
• apps/cms/schema.graphql — ExperienceSectionsDynamicZone union (line 693)

[up-tandem]

Execution plan for #97

Coverage audit

Existing test suites (13 files, ~1,438 lines) already satisfy most acceptance criteria:

Criterion	Status	File
Data layer fetch paths (watch home, by-slug)	✅	experienceService.test.ts (8 tests)
Mapping for all 10 section types	✅	sectionMapper.test.ts (17 tests)
Nested content (Section→content, Container→slots→content)	✅	sectionMapper.test.ts
MediaCollection variant tests (all 5)	✅	MediaCollectionRenderer.test.tsx
SectionDispatcher dispatch tests	✅	SectionDispatcher.test.tsx (11 tests)
Tests run in CI	✅	CI pipeline (#318)
README with how to run tests	❌	Missing
useExperience hook tests	❌	No test file

Tasks

1. useExperience.test.ts — New test file covering:

   • Starts in loading state
   • Resolves to success when getWatchHome returns data (no slug)
   • Resolves to success when getExperienceBySlug returns data (slug provided)
   • Falls back to fallbackSlug when primary returns no data
   • Sets error state when service returns an error
   • Sets error state when service throws
   • Ignores stale responses after unmount (cancellation)

2. README.md — Add "Testing" section documenting pnpm --filter @forge/expo test and test conventions.

Approach

• Mock experienceService module (not Apollo client) to keep hook tests focused on state transitions and fallback logic.
• Use @testing-library/react-native renderHook or direct react test utilities.
• Keep tests deterministic — no network, no timers.