sentry-react-native: Hermes, sentry source map is showing wrong code in both codepush and production build, but not when running in dev

Environment

  • How do you use Sentry?

self-hosted Sentry 21.4.037b2bca

  • Which SDK and version?

@sentry/react-native: 3.1.1

Steps to Reproduce

git clone https://github.com/pass-culture/pass-culture-app-native.git
cd pass-culture-app-native
nvm use
yarn 
  1. Source this file https://github.com/pass-culture/pass-culture-app-native/blob/master/scripts/upload_sourcemaps_to_sentry.sh#L7-L35 with . scripts/upload_sourcemaps_to_sentry.sh, this follow the step to generate sentry source map for react native with hermes
  2. upload the source map to sentry using the same script
  3. generate an error like in here: https://github.com/pass-culture/pass-culture-app-native/blob/master/src/features/cheatcodes/pages/Navigation/Navigation.tsx#L86-L92

Expected Result

I expect to see the error in sentry with the source maps showing the proper code, like when I run the app in __DEV__,

image

Actual Result

Production build does show some unexpected source map for the same error :

image

When I check the minified version, we can clearly see that the error happen in onPress:

image

This is the same error with Android :

image

Again we clearly see that the error is in onPress:

image

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 3
  • Comments: 43 (17 by maintainers)

Most upvoted comments

@kopax-polyconseil @marandaneto I apologize for the delay, I finally finished my finals.

Anyways, I’ve reproduced the issue with the bad source maps, however, I found that if I use the source maps that are automatically generated by our react native build scripts those work perfectly. Upon further investigation I found that the bundle output from the build script is correct, however when you manually run the bundle command, the output is not the same.

I will need some time to investigate this further.

@kopax-polyconseil For iOS, I just tried on your reproduction, you will want to upload the original bundle.

I am not able to test with code push right now, but I would assume it would use the original bundle as well.

This is very unexpected behavior and is not consistent with how it was previously…I will get to the bottom of this.

Regarding the renamed hbc file (which appears in sentry artifacts as 0 bytes), I tested this in a brand new release and the symbol maps worked as expected, but it’s not clear whether this only works because I previously uploaded the original index.android.bundle in a previous release and maybe sentry is still using a cached copy of that original bundle from the previous release?

For now, I will stick with uploading the original index.android.bundle and not upload the renamed hbc that appears as 0 bytes. I was getting inconsistent behavior with the renamed hbc anyways. If anyone could offer more guidance on this, that would be awesome!

I was able to get sourcemaps working for a manually built jsbundle w/ hermes enabled for Android used for Code Push with these steps

  1. When building the jsbundle manually w/ hermes for Android, I used the exact same build and sourcemap steps for hermes as seen in node_modules/react-native/react.gradle. The steps are generally the same as seen in sentry docs for manually generating sourcemaps for hermes with a few differences around file naming conventions. (However, I had avoid the step that moves and renames the index.android.bundle.hbc to index.android.bundle. If I tried to upload this renamed index.android.bundle to sentry, it showed up as 0 bytes for file size in my release artifacts and I got a “Source code was not found” error in my events. I had to upload the original index.android.bundle that was built from the react-native bundle command and the index.android.bundle.map created in the compose-source-maps.js script.)

  2. Each time I tested a change to generating sourcemaps, I created a unique dist such as android-test1, then I recompiled the app and regenerated+uploaded the new sourcemaps to test if my source maps were working. Otherwise, even though I replaced a sourcemap for a release / dist, an older cached copy of the source map was still in effect for my events.

Environment

react-native: 0.68.1
@sentry/react-native: 3.2.13
@sentry/cli: 1.72.0

@jennmueng can you double check that, please?

So after checkin the 3rd reproduction it is now working, I needed to change the build apk commande from ./gradlew assemble to ./gradlew assembleRelease

Here is a sentry.io error which also have unfortunately the same problem as the self hosted : https://sentry.io/organizations/pass-cultureu/issues/3243092397/?project=6212953&query=is%3Aunresolved+V09ST&statsPeriod=14d

Hello @marandaneto , I have tested in an empty environment and it can run, all the keys are here. Also, I am starting today a latest create react native app with latest dependency and selfhosted then sentry.io project, to check if the problem persist, as you requested before. I hope all of these configurations will help us understand where it is failing soon.

I’m experiencing something similar

Yes, I will. So far we are still stuck, it seems that @jennmueng can see with the provided event.json and builded .map that we have an issue, but without being able to build the application it seems hard for him to tell why do we have wrong source map.

I have offered some help to build our app, and a peer programming session. I will keep you tuned.

As we have no hint at all why doing what’s explained on sentry documentation, if anyone want to jump into this bug resolution and help us troubleshoot, it would still be welcomed.