Error Analysis

Tracking will start at the 1st screenview event, it is required to have screen tracking implemented. Make sure to follow the React Native Track screens sections.

If you are in the process of implementing the SDK for the 1st time (or choose to take this update as an opportunity to review your Privacy related implementation), make sure to follow the React Native Privacy section and use the Opt-in API to get the user consent, otherwise no data will be collected.

If you have already integrated the Contentsquare Bridge and enabled Error Analysis on CS Apps Analytics, the Error Analysis SDK should seamlessly function. However, note that additional configuration is required specifically for Android apps.

With the use of a Gradle plugin, an instrumentation of your code will be performed to collect the data about network errors.

plugins {
   id "com.contentsquare.error.analysis.network"  version "1.1.0"
}

buildscript {
   repositories {
      maven {
         url "https://plugins.gradle.org/m2"
      }
   }
   dependencies {
      classpath "com.contentsquare.gradle:error-analysis-network:1.2.0"
   }
}

apply plugin: "com.contentsquare.error.analysis.network"

plugins {
   id("com.contentsquare.error.analysis.network")  version "1.2.0"
}

buildscript {
   repositories {
      maven {
         url = uri("https://plugins.gradle.org/m2")
      }
   }
   dependencies {
      classpath("com.contentsquare.gradle:error-analysis-network:1.2.0")
   }
}

apply(plugin = "com.contentsquare.error.analysis.network")

You do not need to do anything to start the Error Analysis SDK, it will start itself with Contentsquare SDK.

Look at the native SDK docs for validation on each platform.

📚 Validate Android SDK integration
📚 Validate iOS SDK integration

For best implementation practices of our library, explore the Contentsquare for React Native sample app ↗.

API Errors automatically collects failed network requests.

By default, the API Errors feature collects the URL path of the failed API requests. To prevent the collection of Personal Data in the URL path, you can rewrite the request URL path with the ErrorAnalysis.setUrlMaskingPatterns SDK API.

Replace a step of the path - meaning between two slashes (/) - containing Personal Data with a variable:

• becomes CS_ANONYMIZED_USER_ID
• becomes CS_ANONYMIZED_ADDRESS

import { ErrorAnalysis } from '@contentsquare/react-native-bridge';

ErrorAnalysis.setURLMaskingPatterns([
  'https://www.contentsquare.com/users/:user_id/address/:address',
]);

If in-app features are enabled, a info log should appear with the details of the event (see React Native Debugging and Logging section):

I/CSLIB: API Error - GET 401 https://api.client.com

CSLIB ℹ️ Info: API Error - GET 401 https://api.client.com

The way our SDK works is by auto-starting with the application launch and automatically collects failed network requests.

Once started, our SDK fetches its config from our servers. It will start collecting data from network events if the API Errors setting is enabled in the config (this is handled by the Contentsquare team).

The SDK monitors only the API Errors with response code above 400, and generates analytics data. These events are then locally stored, and eventually sent to our servers in batches.

For each network error, a new event will be sent in analytics and Session Replay data. Check the following sections to learn more about how data is processed and sent:

• Analytics requests
• Session Replay requests

API Errors troubleshooting details enables you to collect more information about API errors so you can troubleshoot errors faster.

With this feature you will be able to see three types of additional API error details in the Event Stream of Session Replay.

• The HTTP headers of the request and the response.
• The body (the data sent by the request or received in the response).
• The query parameters of the request endpoint (of the URL of the information you request for).

See API Troubleshooting Details ↗ for more details.

This method will mask URLs of failing API calls to URLs that match the template URL.

Use colon (:) to indicate a dynamic parameter.

import { ErrorAnalysis } from '@contentsquare/react-native-bridge';

ErrorAnalysis.setURLMaskingPatterns([
  'https://<domain>/:status_code/person/:person_id/store/:store_id',
]);

Only network calls in error (response code above 400) will be collected.
Here the exhaustive list of data collected:

• URL (without query strings)
• HTTP method
• Response code
• Timestamp of the request
• Timestamp of the response
• HTTP headers of the request
• HTTP headers of the response
• HTTP body of the request
• HTTP body of the response
• Query parameters of the request endpoint

Contentsquare Error Analysis is not compatible with Firebase Performance Monitoring auto-collection. Only one of the two will log events, and usually, the events will be automatically logged by the Contentsquare Error Analysis. To log events to Firebase Performance Monitoring, we suggest logging it manually ↗.

Contentsquare Error Analysis is compatible with Firebase Performance auto-collection, but the HTTP body from the response won’t be collected by the Error Analysis SDK.

Workaround: Disable Firebase automatic monitoring:

// <project-root>/firebase.json
{
  "react-native": {
    "perf_auto_collection_enabled": false
  }
}

Contentsquare Error Analysis may not be compatible with other network auto-collection tools.