Troubleshooting

Troubleshooting log for the POS UI Extensions library. Listed are some possible errors and resolutions to help aid in the event of unexpected error messages.

An API or a component doesn't work despite following the documentation

### Resolution The POS UI extensions documentation represents the latest version of our components and APIs. If you're using an older version of the POS UI extensions library, then some features mentioned in the documentation might not be available to you. Visit the [changelog](/docs/api/pos-extensions/ui-extensions-reference/versions) to make sure you're using the latest version of POS UI extensions. Additionally, if your app has multiple extensions, please ensure that all extensions have the same version of the POS UI extensions library installed. Failure to do so may cause unexpected behavior when loading extensions from the development server. This will be fixed in a future release of the CLI.

Example

You're attempting to use the `[ScannerAPI](/docs/api/pos-extensions/ui-extensions-reference/api/scanner)`, but it doesn't work. You've done everything according to the documentation.

Extension QR code does not work on Android

### Resolution Android devices can have a restriction on how deep links are handled. To resolve this issue, you can use one of the following options: 1. Connect the device to your computer. Use Android Studio to open your deep link by running the following command: adb shell am start "com.shopify.pos://pos-ui-extensions?url=". Replace with the URL that you want to test. 2. Download and use a deep link opener app from Play Store.

Examples

Unable to access "..."

It looks like you don't have access to this store. Contact the store administrator for access.

This site can't be reached

Check if there is a typo in com.shopify.pos.

Could not resolve...

### Resolution This error is most likely from missing a dependency in package.json in the app root. Try re-installing your dependencies and running the app again.

Example

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

  node_modules/react-redux/es/utils/reactBatchedUpdates.js:1:40:
    1 │ export { unstable_batchedUpdates } from 'react-dom';

You can mark the path "react-dom" as external to exclude it from the bundle, which will remove this error.

... cannot be used as a JSX component

### Resolution This issue commonly happens when `Yarn` is used for dependency management. The package's version was updated but `npm` conflicts with `Yarn`. In the root of your application run `npm install` to get it up to date as well. Restart your IDE if necessary.

Example

'Tile' cannot be used as a JSX component.
  Its element type 'ReactElement<any, any> | Component<ReactPropsFromRemoteComponentType<RemoteComponentType<"Tile", TileProps, true>>, any, any> | null' is not a valid JSX element.
    Type 'Component<ReactPropsFromRemoteComponentType<RemoteComponentType<"Tile", TileProps, true>>, any, any>' is not assignable to type 'Element | ElementClass | null'.
      Type 'Component<ReactPropsFromRemoteComponentType<RemoteComponentType<"Tile", TileProps, true>>, any, any>' is not assignable to type 'ElementClass'.
        The types returned by 'render()' are incompatible between these types.
          Type 'React.ReactNode' is not assignable to type 'import("/Users/heltisace/app-store-app/node_modules/@types/react-reconciler/node_modules/@types/react/index").ReactNode'.
            Type '{}' is not assignable to type 'ReactNode'.