react-native-paper-dropdown crashes expo app on android

[nibble0101]

I started tinkering with React Native Paper recently before stumbling on this package. This package works fine in development. The android project even builds successfully using EAS. Unfortunately, clicking the dropdown crashes the app entirely both on a physical device and emulator. I'm not sure whether the problem is with expo or this project.

You can see it works fine here in development. To reproduce the problem, perhaps follow this guide to build the apk and install it on an emulator or a physical android device.

[fateh999]

hi @nibble0101 can you share the react-native-paper version you are using so i can try to reproduce this.

[nibble0101]

hi @nibble0101 can you share the react-native-paper version you are using so i can try to reproduce this.

Sure! I'm using react-native-paper v5.12.5. Below are the other dependencies.

 "dependencies": {
    "@expo/vector-icons": "^14.0.2",
    "expo": "~51.0.31",
    "expo-checkbox": "~3.0.0",
    "expo-constants": "~16.0.2",
    "expo-status-bar": "~1.12.1",
    "react": "18.2.0",
    "react-native": "0.74.5",
    "react-native-paper": "^5.12.5",
    "react-native-paper-dropdown": "^2.3.1",
    "react-native-safe-area-context": "4.10.5",
    "expo-linking": "~6.3.1",
    "expo-dev-client": "~4.0.25"
  },

[krylov-mihail]

yes, same here development local build works correctly, while eas build generates code with not working select dropdown that crashes the application react native paper 2.3.1

[HenrikJohnson]

I am experiencing the same issue. In LogCat I can see the following exception.

Error: Looks like you forgot to wrap your root component with `Provider` component from `react-native-paper`.

Please read our getting-started guide and make sure you've followed all the required steps.
                                                                                                
https://callstack.github.io/react-native-paper/docs/guides/getting-started


This error is located at:
    in PortalConsumer
    in Portal
    in ThemedComponent
    in Unknown
    in RCTView
    in Unknown
    in Menu
    in ThemedComponent
    in Unknown
    in Dropdown
    in RCTView
    in Unknown
    in RCTView
    in Unknown
    in ThemeProvider
...

And just to be very clear I do have a theme provider at the top of my app.

I also have the same versions as other people above in this post.

[fateh999]

Are you guys wrapping the code with both providers?

` <ThemeProvider theme={Theme}> <PaperProvider theme={Theme>

  </PaperProvider>
  </ThemeProvider>

`

@HenrikJohnson @krylov-mihail @nibble0101

[nibble0101]

Are you guys wrapping the code with both providers?

`

  </PaperProvider>
  </ThemeProvider>

`

@HenrikJohnson @krylov-mihail @nibble0101

I'm wrapping only in </PaperProvider.

[SteRiccio]

same problem for me too, and I'm wrapping with both PaperProvider and ThemeProvider.

[jhoffi]

Seems like the react-native-paper/babel plugin causes this issue. Removing these lines from my babel.config.js fixed it:

env: {
  production: {
    plugins: ["react-native-paper/babel"],
  },
},

I think it's related to this issue here.

Removing these lines increases the bundle size by a lot.

[fateh999]

@nibble0101 can you check @jhoffi comment

Seems like the react-native-paper/babel plugin causes this issue. Removing these lines from my babel.config.js fixed it:

env: {
  production: {
    plugins: ["react-native-paper/babel"],
  },
},

I think it's related to this issue here.

Removing these lines increases the bundle size by a lot.

[gabrielgouv]

Same problem here on Android, removing react-native-paper/babel works normally

[yahya-evoly]

Same problem with iOS. Removing react-native-paper/babel is not a fix I can afford as it increases the bundle size.

[OneOfOne]

I can confirm this is still an issue, removing the babel plugin isn't really an option.

[sayufu]

Removed env: { production: { plugins: ['react-native-paper/babel'], }, }, And it worked just fine. I think this is the only solution for now.

[MeesterMarcus]

Still running into this issue on ios after TestFlight deployment. Works fine locally and in ios simulator.

[LinusOssmann]

Same here on ios and android. The issue is temporarily fixed when removing the babel configuration which should not be the fix for that. when using expo you can reproduce that issue in a simulator by running npx expo --no-dev --minify. When chaning the babel.config.js add the --clear flag to clear the bundler cache beforehand.

[PaitoAnderson]

This is an issue for me on iOS using expo 52.0.36 and react-native-paper 5.13.1. Didn't notice until TestFlight as development worked fine.

[erockrazor]

I'm hoping to release an app in the near future. I'm thankful for the temporary solution to remove react-native-paper/babel, but the increase in bundle size makes this package not feel production ready.

Are there any leads for how we can resolve this?

[foxysolutions]

I believe this issue has been resolved right? The snack doesn't crash anymore, and I've also not experienced this issue since using it for some weeks. Then maybe close the issue?