POS UI Extensions - Error handling / Sentry setup

Extensions
1

POS UI Extensions are built on React Native, so naturally we are trying to use @sentrysentry/react-native SDK. But we cannot install it because we don’t have access to any of the config files (sentry.properties, webpack config, etc.)

Trying to deploy the extension with @sentry/react-native@7.3.0 throws this error

✘ [ERROR] Could not resolve "react-native"

    node_modules/@sentry/react-native/dist/js/utils/rnlibraries.js:3:59:
      3 │ import { AppRegistry, Platform, TurboModuleRegistry } from 'react-native';
        ╵                                                            ~~~~~~~~~~~~~~

  You can mark the path "react-native" as external to exclude it from the bundle, which will remove
  this error and leave the unresolved path in the bundle.

We can’t mark react-native as external. Is there any way we can use this SDK for our extensions? I suppose if we can deploy our extension with the SDK, we can manually initialize Sentry and manually capture errors. Can Shopify CLI mark react-native as externals?

-
2.
Checkout UI Extensions has a guide for error handling. Is there any recommendations for POS UI Extensions? What other tools are devs using for error handling?

2

You can’t use the react native bundle, as you are operating in a similar web worker to the other ui extensions. Not the actual react native app itself.

You can use a similar method as the checkout extensions describes, but I’d ensure you capture your own errors in try/catches than a global error handler. :slight_smile: