Firebase Crashlytics is great. It works great with native apps, and the integration with native Android and iOS apps is quite simple and well documented. However, integrating Firebase Crashlytics with a flutter-based app is a little tricky. When I started integrating Crashlytics with one of my flutter apps, I had one problem.

I knew I had to use this plugin: firebase_crashlytics

The documentation on the above plugin’s page is great. And, if you follow the steps correctly, you should have no problems in integrating the plugin successfully on both Android and iOS apps. Mind you, this process might take some time, depending upon your proficiency on Android and iOS development.

Basically there are 4 different steps that you need to follow:

1. Add the plugin’s dependency in pubspec.yaml file
2. Complete the steps mentioned in the Android integration section
3. Complete the steps mentioned in the iOS integration section
4. Finally, complete the steps mentioned in the Setup Crashlytics

All these steps are quite straight-forward. But the problem I faced was this:

Whenever a crash occurred, the Crashlytics plugin successfully caught it and reported to the Firebase Crashlytics console. However, the flutter console did not show the stack trace of the crash.

So, if I needed to figure out the reason for the crash, I had to go to the Firebase Crashlytics dashboard to view the details of the crash. The only logs that were printed on the console were this:

I/flutter (21601): Error caught by Crashlytics plugin :
E/CrashlyticsPlugin(21601): Unable to generate stack trace element from Dart side error.
I/flutter (21601): firebase_crashlytics: Error reported to Crashlytics.

This was troublesome during development. I needed to have the stack trace printed locally, and also needed to send to Crashlytics. To fix this, I had to do add a few lines of code.

The plugin’s documentation mentions to have the following code to initialise and setup Crashlytics, which does the job of sending your crashes to Crashlytics.

Future<void> main() async {
  await Firebase.initializeApp();

  Crashlytics.instance.enableInDevMode = true;

  FlutterError.onError = Crashlytics.instance.recordFlutterError;
  runZoned(() {
    runApp(MyApp());
  }, onError: Crashlytics.instance.recordError);
}

And below are the changes that I made (in red).

Future<void> main() async {
   await Firebase.initializeApp();

   Crashlytics.instance.enableInDevMode = true;

   FlutterError.onError = Crashlytics.instance.recordFlutterError;
   runZoned(() {
      runApp(MyApp());
   }, onError: onCrash);
}

// A new function callback when a crash occurs.
void onCrash(Object exception, StackTrace stackTrace){
   // Prints the exception and the stack trace locally
   print(exception);
   print(stackTrace);
   // Send the strack trace to Crashlytics
   Crashlytics.instance.recordError(exception, stackTrace);
}

That’s it, now along with sending the crash report to the Crashlytics Dashboard, you can view the same on the flutter console as well.