Spectodocs

React Native

Record your React Native app into the same project as your website. A session keeps the app's screens, network requests, console output, errors and your custom events — they show up in Sessions, Issues, funnels and paths like a web session's.

Apps have no DOM, so there is no screen replay: an app session's page shows its timeline, requests, logs and errors. In Sessions, + Filter → Device finds phone and tablet sessions; the user agent names the app and its version.

Install

npm install @spectosh/react-native @react-native-async-storage/async-storage

AsyncStorage is optional — it keeps one visitor id across launches (without it, every launch is a new visitor). The SDK has no other dependencies and works with Expo.

Start recording

import AsyncStorage from '@react-native-async-storage/async-storage'
import { init } from '@spectosh/react-native'

export const spectoReady = init({
  key: 'pk_your_key',
  endpoint: 'https://specto.sh',
  storage: AsyncStorage,
  app: { name: 'Shop', version: '1.4.2' },
})

init reads the project's capture settings (Settings → Privacy): with recording off, or outside the sample rate, it records nothing. The project's strict privacy applies to the app too.

Screens

A screen is a page to the dashboard (/Checkout), so funnels and paths work across the app. With React Navigation, every focused route is recorded:

const navigationRef = createNavigationContainerRef()

<NavigationContainer ref={navigationRef}
  onReady={async () => (await spectoReady).trackNavigation(navigationRef)}>

Without it, call specto.screen('Checkout') when a screen opens.

Users, events and errors

const specto = await spectoReady
specto.identify(user.id, { plan: 'pro' })      // the session's user and traits
specto.track('checkout_started', { items: 3 }) // a custom event
specto.captureError(error)                    // a caught error

Uncaught JavaScript errors are recorded for you (through React Native's ErrorUtils; your own handler still runs) and grouped in Issues with your website's.

What is recorded

What
ScreenstrackNavigation or screen(name)
RequestsMethod, URL, status and duration of every fetch and XMLHttpRequest — never bodies or headers. Strict privacy drops query strings.
Consoleconsole.log/info/warn/error/debug text. Strict privacy masks it; captureConsole: false turns it off.
ErrorsUncaught errors (fatal ones marked) and captureError.

Email addresses and card-length numbers are replaced before anything leaves the device. Events go out in batches every 5 seconds and when the app moves to the background; a batch that fails is retried with the same number, so it's stored once. After 30 minutes in the background, the next foreground starts a new session.

Options

OptionDefault
key—The project’s public key (Settings → Install).
endpoint—Your Specto URL: https://specto.sh
storagememoryAnything with getItem/setItem — AsyncStorage.
app—{ name, version }, shown with the session.
privacy'balanced''strict': no query strings, console masked. The project's setting wins when stricter.
captureConsoletrue
captureNetworktrue
sampleRate1The lower of this and the project’s rate applies.
tabletfalseCount an Android tablet as a tablet.