React-Native(IOS) app Crashing

Help - Plug n Play PnP React Native SDK
1

When trying to import or use @toruslabs/react-native-web-browser in a React Native app, the browser crashes on iOS, but it works fine on Android. Do I need to use a different browser for iOS? Is there any issue with this?

2

Hi Praveen!

I see you’re experiencing a crash on iOS when using @toruslabs/react-native-web-browser in your React Native app, while it works fine on Android. It seems like you’re using the PnP React Native SDK.

To help the support team assist you better, could you provide the following details if possible:

  • Any code snippets related to the Web3Auth initialization and login.
  • Screenshots of the browser console errors, if available.
  • The specific iOS version you’re testing on.

As for your question, @toruslabs/react-native-web-browser should work on both iOS and Android. There could be different reasons for the crash:

  1. iOS-specific Configuration: Ensure that all iOS specific setup steps in the library’s documentation are completed.
  2. Permissions: Check if all necessary permissions are configured properly in your Info.plist.
  3. Different Browser Library: Sometimes using a different browser library or version may help.

If you’ve already checked these and the problem persists, sharing the above details will help us investigate further. Thank you!

Note: This response was generated by an AI bot and may require further verification. The Web3Auth support team has tracked this issue and will be responding as soon as possible.

Additionally, we would recommend you to join our biweekly Office Hours to get this resolved even faster. Web3Auth Developer Office Hours

3

Hey Praveen,
Sorry that you are facing issues with IOS
can you help us more with package version you are using and examples you referred to build the app

I recommend reviewing the metro.config.js setup mentioned in our documentation here. Additionally, make sure you’ve installed the required polyfill packages as outlined in the guide—this is essential for everything to work correctly. If you’ve already completed these steps and are still encountering issues, feel free to reach out. We’re happy to assist!

4 
metro.config.js:
const config = {
  transformer: {
    babelTransformerPath: require.resolve(
      "react-native-svg-transformer/react-native"
    )
  },
  resolver: {
    extraNodeModules: {
      assert: require.resolve("empty-module"), // assert can be polyfilled here if needed
      http: require.resolve("empty-module"), // stream-http can be polyfilled here if needed
      https: require.resolve("empty-module"), // https-browserify can be polyfilled here if needed
      os: require.resolve("empty-module"), // os-browserify can be polyfilled here if needed
      url: require.resolve("empty-module"), // url can be polyfilled here if needed
      zlib: require.resolve("empty-module"), // browserify-zlib can be polyfilled here if needed
      path: require.resolve("empty-module"),
      crypto: require.resolve('react-native-crypto'),
      stream: require.resolve("readable-stream"),
      ...require("node-libs-react-native"),
    },
    assetExts: assetExts.filter((ext) => ext !== "svg"),
    sourceExts: [...sourceExts, "svg"]
  }
};


packages:
 "@toruslabs/openlogin-session-manager": "^3.1.1",
    "@toruslabs/react-native-web-browser": "^1.1.0",
    "@toruslabs/session-manager": "^3.2.0",
  "react-native-url-polyfill": "^2.0.0",
 "@web3auth/auth-adapter": "^9.5.1",
    "@web3auth/ethereum-provider": "^9.5.1",
    "@web3auth/no-modal": "^9.5.1",
    "@web3auth/openlogin-adapter": "^8.12.4",
    "@web3auth/react-native-sdk": "^8.0.0",
5

Hey WebJonath,

I just checked with the example app, and it works fine on iOS.

Please review our guide: React Native Integration Guide and refer to this example:
Web3Auth React Native Quick Start.

Let me know if you run into any issues! :rocket: