Compatibility

Each version of the Contentsquare bridge will be linked to specific, fixed versions of each native SDK. In order to make that clear, here is a compatibility table to consider when choosing your version of the bridge. Refer to the React Native Bridge Changelog to know what the changes are for each version.

*make sure to add this configuration if your RN version is below 0.70.0

**make sure to add this configuration to the Android app if your RN version is between 0.69.0 and 0.70.0, and this configuration to the Android app if your RN version is between 0.65.0 and 0.68.0.

***we support all React Native versions that are currently maintained and listed on the official React Native documentation ↗.

Depending on if you created your app as a React Native first app, or if you gradually added some React Native code to your Native first app, you might be using some non JavaScript elements in your app, as well as a mix of native screens and JavaScript screens. If that is the case, it is your responsibility to track all of the screens, either by calling our native SDKs directly in the first case, or the bridge in the second. The same remark applies for other functionalities of the SDK - for example, you might need to send a Transaction Event via the native SDK or via the bridge, depending on the technology used to create your buying page.

Have a look at the Android and iOS SDKs to find out how to call them in native parts of your app.

Also, note that we specifically cover the use of the JavaScript bridge in this documentation. You should never call the Bridge’s NativeModule directly yourself. If for any reason you do so, know that we cannot certify that your implementation will work as expected. Only call our SDKs through the JavaScript Contentsquare module we provide in you JavaScript code (as explained in this document), or directly in your native code.

To use the SDK on an Expo app, you need to have an Expo project with EAS (Expo Application Services). The SDK compatibility with Expo projects requires the extra steps described below.

Add the plugin and your Contentsquare bundle identifier to your app configuration file:

{
  "expo": {
    ...,
    "ios": {
      "bundleIdentifier": "com.cs.expo.app", // replace with your bundle id
      ...
    },
    "android": {
      "package": "com.cs.expo.app", // replace with your bundle id
      ...
    },
    "plugins": [
      "@contentsquare/react-native-bridge",
    ],
}

To run your Expo app with the Contentsquare SDK, you can’t use Expo Go since it needs native files and features. To run your app, use expo run:ios or expo run:android.

Or, you can replace the scripts to your app in your project’s package.json:

"scripts": {
  ...
  "android": "expo run:android",
  "ios": "expo run:ios",
},

If you are using PanResponders in your app, a bug might appear on the element implementing it where it will only move for about a second and then freeze. This bug is caused by a conflict between the React Native SDK and our Bridge related to tracking swipe events. May you encounter this bug, the current workaround is to stop the Contentsquare tracking when the pan gesture starts, and resume it as the gesture ends, as follows:

const panResponder = useRef(
  PanResponder.create({
    [...]
    onPanResponderGrant: (evt, gestureState) => {
 Contentsquare.stopTracking();
 [...]
    },
    onPanResponderRelease: (evt, gestureState) => {
 Contentsquare.resumeTracking();
 [...]
    },
    [...]
  })
).current;

Note that, although this workaround fixes the bug, applying it means that swipes on view using the PanResponder won’t be tracked by Contentsquare.