Using Symbolication/Deobfuscation to Get Better React Crash Reports

Moreover, each Instabug report will include all the stack trace information on all the running threads. Instabug will highlight the most important frames in the stack trace. These highlighted frames are your app's frames. And in order for these crashes to be readable, symbolication or deobfuscation is required.

‍

What are symbolication and deobfuscation?

In a crash report, stack traces are sent with only memory addresses resembling the included frames. Compiling a release build for your app will strip the debug symbols to reduce the size of the generated binary. Symbolication and deobfuscation are the processes of transforming these stack traces' active memory addresses into something human-readable in terms of methods and functions.

‍

How to symbolicate/deobfuscate crashes

In order to symbolicate your crashes, you need to upload a reference for the debug symbols that got stripped. For iOS, this reference is called a Debug Symbol file (dSYM) and for Android it's called a mapping file. These debug symbols will attribute the unreadable memory addresses to their function and method names.

‍

How to upload dSYM and mapping files

iOS

Each app build you compile has a UUID, which your dSYM file will be attributed to. To find your project's dSYM, run the following command on your Instabug dashboard.

After locating your project’s dSYM, you can then upload it manually or automatically.

Each app is unique and to ensure the best possible output, the mapping files should be attributed to the latest version of your app. Make sure your app is selected. You can upload a mapping file manually or automatically.

‍

Android

Each app is unique and to ensure the best possible output, the mapping files should be attributed to the latest version of your app. Make sure your app is selected. You can upload a mapping file manually or automatically.

‍

Uploading Source Maps Manually

iOS

In order to upload your dSYM file to Instabug’s dashboard, you need to find it. If your app build has Bitcode enabled, you will need to download dSYMs first from Xcode.

To upload dSYMs for Bitcode-enabled apps, follow these steps:

• In Xcode, select Window then Organizer.
• Under the Archives tab, select an archive with the app version you need to symbolicate crashes from.
• Click the Download dSYMs... button. Xcode will insert the .dSYM files into the selected archive.
• View the archive by right-clicking on it in Xcode and selecting Show in Finder.
• Right-click on the archive and select Show Package Contents, then open the dSYMs directory.
• Compress all the .dSYM files you find in that directory and upload the archive to the Instabug dashboard.

If you’re not using Bitcode, you will need to find the dSYM files on the machine you used to build the app. Make sure that the dSYM gets generated during building in order to proceed. You can check the Debug Information Format build setting in Xcode where this is controlled.
With the UUID of your app, you can find the dSYM with the mdfind <UUID_of_app> command.

Now that you have the location of the dSYM, you will find the actual dSYM file inside a Contents/Resources/DWARF subdirectory.

Now that you have the dSYM file:

• Compress the dSYM file you have located on your machine into a zip file.
• Go to Upload dSYMs in the Settings menu of your Instabug dashboard.
• Upload the compressed file.

‍

Android

You can find the file to upload at a file path that is similar to the following, but specific to your app:

Now that you have the mapping.txt file:

• Go to Upload Mapping Files in the Settings menu of your Instabug dashboard.
• Upload the mapping.txt file.

‍

Uploading Source Maps Automatically

If your app token is defined as a constant or you have different tokens for both iOS and Android apps, set the token as shown in the sections below.

‍

iOS

• To enable automatic uploading on iOS, follow the below steps:
• Navigate to the build phases of your project in Xcode
• Expand Upload Sourcemap

‍

Android

To enable automatic uploading on Android, follow the below steps:

• Navigate to the ^build.gradle file of your library
• You should find the below code. You only need to replace ^{YOUR_APP_TOKEN} with your token from the dashboard.

‍

JavaScript Crashes

Uploading Source Map Files

You can follow these steps to generate iOS and Android source map files and upload them. Go to your root directory.

‍

iOS

• Run the following shell script.

• Upload the generated file "ios-sourcemap.json" at your project’s root directory.

‍

Android

• Run the following script.

• Upload the generated file"android-sourcemap.json" at your project’s root directory.

‍

Symbolicated/Deobfuscated Crashes

Now that your crash reports have been symbolicated/deobfuscated you can view stack traces in a human-readable format. Stack traces will highlight the most important frames and methods involved in the resulting crash. With the full detail provided by Instabug’s crash reports as well as having different crash occurrence filtering will help you diagnose what went wrong.When an app crashes, a crash report highlighting the app conditions leading up to the crash is generated. With Instabug’s crash reporting tool you can have detailed crash reports sent to your dashboard instantly. Each Instabug crash report captures a detailed report of the running environment, the different threads’ states, the steps to reproduce the crash, and the network request logs.