Skip to content

README.md

Latest commit

 

History

History
155 lines (106 loc) · 4.5 KB

README.md

File metadata and controls

155 lines (106 loc) · 4.5 KB

Contentful Logo

Contentful Personalization & Analytics

React Native Reference Implementation

Warning

The Optimization SDK Suite is pre-release (alpha). Breaking changes can be published at any time.

This is a reference implementation for the Optimization React Native SDK and is part of the Contentful Optimization SDK Suite.

What this demonstrates

Use this implementation when you need an end-to-end React Native example for Android and iOS app targets. It demonstrates SDK initialization, optimized entry rendering, interaction tracking, navigation/screen tracking, offline behavior, preview-panel scenarios, and Detox E2E coverage.

Prerequisites

  • Node.js >= 20.19.0 (24.13.0 recommended to match .nvmrc)
  • pnpm 10.x
  • An Android emulator available and running for Android Detox flows
  • Xcode with an iOS Simulator available for iOS Detox flows

Setup

Run all steps from the monorepo root.

  1. Install pnpm packages:

    pnpm install

  2. Build and package SDK tarballs used by this implementation:

    pnpm build:pkgs

  3. Install implementation dependencies:

    pnpm implementation:run -- react-native-sdk implementation:install

See implementations/react-native-sdk/package.json for more commands.

Running E2E tests

Android E2E tests use Detox. Run these commands from the monorepo root.

  1. Run the full Android E2E flow:

    pnpm implementation:run -- react-native-sdk test:e2e:android:full

  2. Build Android Detox binaries:

    pnpm implementation:run -- react-native-sdk test:e2e:android:build

  3. Run Android Detox tests only:

    pnpm implementation:run -- react-native-sdk test:e2e:android:run

  4. Pass script arguments through to the one-shot runner:

    pnpm implementation:run -- react-native-sdk test:e2e:android:full -- --test-file e2e/offline-behavior.test.js

    The one-shot Android command:

    • creates .env from .env.example for E2E
    • starts the mock server and Metro
    • configures adb reverse
    • builds the Android app (unless skipped)
    • runs Detox tests
    • cleans up background processes

  5. Useful one-shot variants:

    Skip rebuild if the app is already built:

    SKIP_BUILD=true pnpm implementation:run -- react-native-sdk test:e2e:android:full

    Run one test file:

    pnpm implementation:run -- react-native-sdk test:e2e:android:full -- --test-file e2e/offline-behavior.test.js

    Run tests matching a name pattern:

    pnpm implementation:run -- react-native-sdk test:e2e:android:full -- -t "should recover gracefully when network is restored"

  6. Run iOS Detox commands when needed:

    pnpm implementation:run -- react-native-sdk test:e2e:ios:build
pnpm implementation:run -- react-native-sdk test:e2e:ios:run

Increasing E2E logging

Local Android E2E logging is intentionally minimal by default.

  1. Enable script/service logs (Metro, mock server, and adb logcat stream):

    STREAM_BACKGROUND_LOGS=true ENABLE_DEVICE_LOGCAT=true METRO_VERBOSE=true pnpm implementation:run -- react-native-sdk test:e2e:android:full

  2. Increase Detox runner logging and artifacts:

    pnpm --dir implementations/react-native-sdk --ignore-workspace exec detox test --configuration android.emu.debug --loglevel trace --record-logs all --take-screenshots failing --record-videos failing

  3. Read generated logs:

    • implementations/react-native-sdk/logs/mock-server.log
    • implementations/react-native-sdk/logs/metro.log
    • implementations/react-native-sdk/logs/device.log
    • implementations/react-native-sdk/logs/test-results.log

Related