I’ve uploaded my main.jsbundle and the main.jsbundle.map for my React Native project. The sourcemap was uploaded with the rewrite and strip prefix options, but my events are unable to locate the source.
The source lines are prefixed with app:/// and have a processing error:
Source code was not found for app:///main.jsbundle Collapse
{
“url”: “app:///main.jsbundle”
}
Does anyone know the magic incantation to see my stack trace with sourcemap?
A few questions to make debugging this easier:
Is this for on-prem sentry or for the hosted version? Does it show a failure in the UI you could share? Can you list the artifacts for the release?
I’m using hosted Sentry.
My release artifacts are main.jsbundle and ~/main.jsbundle.map.
The error I mentioned was from the UI. Here it is in a screenshot…
How did you upload the files? The sentry-cli react-native-xcode build command should generate a ~/main.jsbundle as well as a ~/main.jsbundle.map for you and set up the links correctly. If you upload these manually you would need to name them appropriately and set up the link with the Sourcemap header between them.
I am using fastlane-plugin-sentry, but it wasn’t clear to me how to generate the sourcemap in that environment, so I generated it manually using react-native bundle --sourcemap-output according to https://github.com/getsentry/react-native-sentry/blob/c98d2a36c0a7804581e69d3a755a675038cbc7d4/docs/index.rst#sourcemaps-for-other-platforms. If this doesn’t work for iOS, then I guess it isn’t going to work for Android either. Is there a better way?
If you add the sentry-cli react-native-xcode build step to your xcode project it should also execute if you run it through fastlane.
For android there is no integrated build process yet, but there is one on a branch. Should be out in a few days if everything goes well.
Thanks @mitsuhiko, I am anxiously waiting the Android support. I’m actually holding back the release of our app for it, so that we will have full visibility on crashes in the wild using sentry.io.
So it seems I was incorrect in assuming that I could replace the sentry-cli react-native-xcode script with fastlane. It sounds like I should add it back to the xcode project?
I am currently running 4 sentry fastlane actions: sentry_create_release, sentry_upload_dsym, sentry_upload_file and sentry_upload_sourcemap. Should I actually be using any of these? Or should I let the xcode run script do it all?
One of the things I liked about doing it in fastlane vs the run script, is that is sped up building and testing on a physical device vs emulator quite a bit.
I just tried going back to using the sentry-cli react-native-xcode and sentry-cli upload-dsym in my xcode run script. I removed all of the sentry fastlane actions I had. I deployed a new release build test flight and caused an exception. Here’s what I observe:
2.0.0 (52)Source code was not found for app:///main.jsbundle
This is why I started down the path of trying to use sentry-cli and fastlane. So I guess the net result is, I still don’t really know how to get my iOS and Android sourcemaps working for React Native, or what the recommended method is. Any help would be much appreciated.
When the crash is captured, a new release appears as 2.0.0 (52)
This sounds like you have an old version of the client which does not support the distribution format yet which is what sentry-cli uses now. If you upgrade that should be solved as releases are now correctly sent as reverse.domain.name-2.0.0 with 52 as dist.
I’ve updated to react-native-sentry 0.8.0 and 1.9.0. Yay full Android support!
I just created a new build on iOS, using the standard sentry build phase run script.
When I trigger an error it comes through as release 2.0.0, dist 53. So that part seems ok now. However, the release does not have bundle.js and bundle.js.map for dist 53. Not sure about dsyms yet.
The docs don’t seem to have changed much for this new release. For Android, I assume I need to upload the artifacts manually, or via fastlane?
The docs don’t seem to have changed much for this new release.
Yeah, we’re trailing there. We will update this ASAP.
For Android, I assume I need to upload the artifacts manually, or via fastlane?
In theory if the link step worked correctly it should patch your gradle setup to add our gradle hooks and ./gradlew assembleRelease should push up symbols. (This requires that a .sentryclirc file is on your path with the credentials).
//EDIT: make sure you have a recent sentry-cli version (1.8.0 or later) or distributions won’t work correctly
Hi I’m experiencing the same trouble with my sourcemap, I am uploading the map manually using sentry-cli, can you elaborate on “f you upload these manually you would need to name them appropriately and set up the link with the Sourcemap header between them.”?
Do I need to do something more after running node node_modules/react-native/local-cli/cli.js bundle --platform ios --dev false --assets-dest ./ios_bundle_out --entry-file index.ios.js --bundle-output ios_bundle_out/main.jsbundle --sourcemap-output ios_bundle_out/main.jsbundle.map before uploading with sentry-cli?
So normally the assembleRelease step does everything and will also upload. Is there a reason you cannot use that step? Manually fiddling with the CLI is painful and very complex.
We’re integrating some react-native parts in an existing ios app with an file structure that differs from what you get with create-react-native-app, hence I do not feel comfortable with using deployment scripts crafted for the conventional react-native app approach.
this is how I upload the source map in the build phase of xcode:
sentry-cli --auth-token $AUTH_TOKEN releases -o $ORG_SLUG -p $PROJECT_SLUG new $RELEASE_NAME
sentry-cli --auth-token $AUTH_TOKEN releases -o $ORG_SLUG -p $PROJECT_SLUG files $RELEASE_NAME upload-sourcemaps $MAP_PATH
We’re integrating some react-native parts in an existing ios app with an file structure that differs from what you get with create-react-native-app, hence I do not feel comfortable with using deployment scripts crafted for the conventional react-native app approach.
Our deploy step uses the standard react-native assemble release step which has nothing to do with create-react-native-app.
If you do want to manually do this you need to pass --rewrite to upload-sourcemaps. Additionally you will need to provide the distribution parameter for each release you are crafting for android so it matches the versionCode.
You might have an easier time by using the sentry-cli react-native gradle command and invoke it something like this:
sentry-cli react-native gradle --sourcemap path/to/sourcemap --bundle path/to/bundle --release NAME_OF_RELEASE --dist VERSION_CODE
This is what gradlew assembleRelease uses underneath the hood.
--rewrite did not make any difference. How do I auth with sentry-cli react-native gradle? Am I not suppose to use sentry-cli react-native xcode?
I was under the impression you are building an android release? The xcode step is for an xcode project when you build an ios build and the gradle one is used by the gradle plugin for android.
When you walk off the supported paths it gets really tricky to support that.
If anything was unclear, it is an iOS project 
.
So, what really differs my ios project from what you get with create-react-native-app is that my project structure is that the ios-project the root and then having the react codebase as a submodule in a subdirectory, instead of the other way around. And that the RCTRootView is not instantiated in the AppDelegate but rather deeper in the application. I already got sentry-swift up and running in the ios app since earlier and did not think there would be any complications by adding the react native support for the same sentry dns.
I’ve put the bundle and assets in a path like this: ios_proj_root/Resources/ReactNative
Everything works as expected, I can see the crash reports in the sentry UI triggered from within the react-native source in the same release as the regular ios app crashes, I just cannot resolve the js source with the map and I end up with the error: “Source code was not found for app:///main.jsbundle”.
Am I just missing something like --url-prefix when uploading the source map or what?
Alright. So first of all create-react-native-app is a bit of a red herring here as we do not explicitly support it at the moment.
I just cannot resolve the js source with the map and I end up with the error: “Source code was not found for app:///main.jsbundle”.
That is most likely expected because you do not supply the correct distribution for the release. Is there a reason you cannot use the sentry-cli react-native xcode build step in your xcode project like outlined in the documentation? That way if you make a release the source maps are automatically uploaded.
If you do want to do it manually you need to supply --dist VERSION where VERSION is the integer version of your ios project (forgot what apple calls it, build?). Additionally you need to set the release name to your.bundle.id-HUMAN_READABLE_VERSION and pass --rewrite to upload-sourcemaps. The url prefix is configured correctly by default (~/).