Capacitor Firebase Crashlytics Plugin

Unofficial Capacitor plugin for Firebase Crashlytics.[^1]

Use Cases

The Firebase Crashlytics plugin is typically used to monitor the stability of an app in production, for example:

• Crash reporting: Collect crash reports from your app on Android and iOS and inspect them in the Firebase Console.
• Non-fatal error tracking: Record handled exceptions with recordException(...), including JavaScript stack traces generated by stacktrace.js.
• Debugging context: Attach custom keys, log messages, and a user ID to your reports to make crashes easier to reproduce.
• Privacy compliance: Enable or disable automatic data collection at runtime, for example after the user has given their consent.

Compatibility

Guides

• Crash Reporting in a Capacitor App with Crashlytics: Crash and non-fatal error reporting with custom keys, logs, and user IDs using this plugin.
• How to Use Firebase in a Capacitor App: Where crash reporting fits in a production Firebase app, next to analytics and performance.

Installation

You can use our AI-Assisted Setup to install the plugin. Add the Capawesome Skills to your AI tool using the following command:

npx skills add capawesome-team/skills --skill capacitor-plugins

Then use the following prompt:

Use the `capacitor-plugins` skill from `capawesome-team/skills` to install the `@capacitor-firebase/crashlytics` plugin in my project.

If you prefer Manual Setup, install the plugin by running the following commands and follow the platform-specific instructions below:

npm install @capacitor-firebase/crashlytics
npx cap sync

Add Firebase to your project if you haven't already (Android / iOS).

Android

Crashlytics Gradle plugin

First, add the dependency for the Crashlytics Gradle plugin to your root-level (project-level) Gradle file (<project>/build.gradle):

buildscript {
    dependencies {
+       // Add the dependency for the Crashlytics Gradle plugin
+       classpath 'com.google.firebase:firebase-crashlytics-gradle:2.9.9'
    }
}

Add the Crashlytics Gradle plugin to your module (app-level) Gradle file (usually <project>/<app-module>/build.gradle):

apply plugin: 'com.google.firebase.crashlytics'

Variables

If needed, you can define the following project variable in your app’s variables.gradle file to change the default version of the dependency:

• $firebaseCrashlyticsVersion version of com.google.firebase:firebase-crashlytics (default: 20.0.3)

This can be useful if you encounter dependency conflicts with other plugins in your project.

iOS

Swift Package Manager

Add the following to your capacitor.config.json (or capacitor.config.ts) to avoid a SwiftPM package identity collision:

{
  "experimental": {
    "ios": {
      "spm": {
        "packageOptions": {
          "@capacitor-firebase/crashlytics": {
            "symlink": true
          }
        }
      }
    }
  }
}

Attention: SPM packageOptions support requires Capacitor CLI 8.4.0+.

dSYM Upload

To generate human readable crash reports, Crashlytics needs your project's debug symbol (dSYM) files. The following steps describe how to automatically upload dSYM files to Firebase whenever you build your app:

1. Open your project's Xcode workspace, then select its project file in the left navigator.
2. From the TARGETS list, select your main build target.
3. Click the Build Settings tab, then complete the following steps so that Xcode produces dSYMs for your builds.
   1. Click All, then search for debug information format.
   2. Set Debug Information Format to DWARF with dSYM File for all your build types.
4. Click the Build Phases tab and complete the following steps:

   1. Click the + button, then select New Run Script Phase.

      Make sure this new Run Script phase is your project's last build phase; otherwise, Crashlytics can't properly process dSYMs.

   2. Expand the new Run Script section.

   3. In the script field (located under the Shell label), add the run script based on your package manager:

      CocoaPods:

      "${PODS_ROOT}/FirebaseCrashlytics/run"
      

      Swift Package Manager:

      "${BUILD_DIR%/Build/*}/SourcePackages/checkouts/firebase-ios-sdk/Crashlytics/run"
      

   4. In the Input Files section, add the paths for the locations of the following files based on your package manager:

      CocoaPods:

      ${DWARF_DSYM_FOLDER_PATH}/${DWARF_DSYM_FILE_NAME}/Contents/Resources/DWARF/${TARGET_NAME}
      

      $(SRCROOT)/$(BUILT_PRODUCTS_DIR)/$(INFOPLIST_PATH)
      

      Swift Package Manager:

      ${DWARF_DSYM_FOLDER_PATH}/${DWARF_DSYM_FILE_NAME}
      

      ${DWARF_DSYM_FOLDER_PATH}/${DWARF_DSYM_FILE_NAME}/Contents/Resources/DWARF/${PRODUCT_NAME}
      

      ${DWARF_DSYM_FOLDER_PATH}/${DWARF_DSYM_FILE_NAME}/Contents/Info.plist
      

      $(TARGET_BUILD_DIR)/$(UNLOCALIZED_RESOURCES_FOLDER_PATH)/GoogleService-Info.plist
      

      $(TARGET_BUILD_DIR)/$(EXECUTABLE_PATH)
      

      If you have ENABLE_USER_SCRIPT_SANDBOXING=YES and ENABLE_DEBUG_DYLIB=YES in your project build settings, also include:

      ${DWARF_DSYM_FOLDER_PATH}/${DWARF_DSYM_FILE_NAME}/Contents/Resources/DWARF/${PRODUCT_NAME}.debug.dylib
      

Configuration

No configuration required for this plugin.

Demo

A working example can be found here: robingenz/capacitor-firebase-plugin-demo

Starter templates

The following starter templates are available:

• Ionstarter Angular Firebase

Usage

The following examples show how to force a test crash, record non-fatal exceptions, add context to crash reports, manage automatic data collection, and handle unsent reports. All methods are only available on Android and iOS.

Force a test crash

Force a crash to test your Crashlytics implementation:

import { FirebaseCrashlytics } from '@capacitor-firebase/crashlytics';

const crash = async () => {
  await FirebaseCrashlytics.crash({ message: 'Test' });
};

Record a non-fatal exception

Record a handled error as a non-fatal report. You can also attach a JavaScript stack trace generated by stacktrace.js:

import { FirebaseCrashlytics } from '@capacitor-firebase/crashlytics';
import * as StackTrace from 'stacktrace-js';

const recordException = async () => {
  await FirebaseCrashlytics.recordException({
    message: 'This is a non-fatal message.',
  });
};

const recordExceptionWithStacktrace = async (error: Error) => {
  const stacktrace = await StackTrace.fromError(error);
  await FirebaseCrashlytics.recordException({
    message: 'This is a non-fatal message.',
    stacktrace,
  });
};

Add context to your crash reports

Set custom keys, a user ID, or log messages that are associated with subsequent fatal and non-fatal reports. This gives you more context for the events leading up to a crash:

import { FirebaseCrashlytics } from '@capacitor-firebase/crashlytics';

const setCustomKey = async () => {
  await FirebaseCrashlytics.setCustomKey({
    key: 'page',
    value: 'home',
    type: 'string',
  });
};

const setUserId = async () => {
  await FirebaseCrashlytics.setUserId({
    userId: '123',
  });
};

const log = async () => {
  await FirebaseCrashlytics.log({
    message: 'Test',
  });
};

Enable or disable automatic data collection

Control whether Crashlytics collects data automatically. The value does not apply until the next run of the app. Checking the current setting with isEnabled() is only available on iOS:

import { FirebaseCrashlytics } from '@capacitor-firebase/crashlytics';

const setEnabled = async () => {
  await FirebaseCrashlytics.setEnabled({
    enabled: true,
  });
};

const isEnabled = async () => {
  const { enabled } = await FirebaseCrashlytics.isEnabled();
  return enabled;
};

Check if the app crashed on the previous execution

Find out whether the app crashed during its previous run, for example to show the user a feedback dialog:

import { FirebaseCrashlytics } from '@capacitor-firebase/crashlytics';

const didCrashOnPreviousExecution = async () => {
  const { crashed } = await FirebaseCrashlytics.didCrashOnPreviousExecution();
  return crashed;
};

Manage unsent crash reports

If automatic data collection is disabled, you can decide whether unsent reports should be uploaded at the next startup or deleted from the device:

import { FirebaseCrashlytics } from '@capacitor-firebase/crashlytics';

const sendUnsentReports = async () => {
  await FirebaseCrashlytics.sendUnsentReports();
};

const deleteUnsentReports = async () => {
  await FirebaseCrashlytics.deleteUnsentReports();
};

API

• crash(...)
• setCustomKey(...)
• setUserId(...)
• log(...)
• setEnabled(...)
• isEnabled()
• didCrashOnPreviousExecution()
• sendUnsentReports()
• deleteUnsentReports()
• recordException(...)
• Interfaces
• Type Aliases

crash(...)

crash(options: CrashOptions) => Promise<void>

Forces a crash to test the implementation.

Only available for Android and iOS.

Since: 0.1.0

setCustomKey(...)

setCustomKey(options: SetCustomKeyOptions) => Promise<void>

Sets a custom key and value that is associated with subsequent fatal and non-fatal reports.

Only available for Android and iOS.

Since: 0.1.0

setUserId(...)

setUserId(options: SetUserIdOptions) => Promise<void>

Sets a user ID (identifier) that is associated with subsequent fatal and non-fatal reports.

Only available for Android and iOS.

Since: 0.1.0

log(...)

log(options: LogOptions) => Promise<void>

Adds a custom log message that is sent with your crash data to give yourself more context for the events leading up to a crash.

Only available for Android and iOS.

Since: 0.1.0

setEnabled(...)

setEnabled(options: SetEnabledOptions) => Promise<void>

Enables/disables automatic data collection. The value does not apply until the next run of the app.

Only available for Android and iOS.

Since: 0.1.0

isEnabled()

isEnabled() => Promise<IsEnabledResult>

Returns whether or not automatic data collection is enabled.

Only available for iOS.

Returns: Promise<IsEnabledResult>

Since: 0.1.0

didCrashOnPreviousExecution()

didCrashOnPreviousExecution() => Promise<DidCrashOnPreviousExecutionResult>

Returns whether the app crashed during the previous execution.

Only available for Android and iOS.

Returns: Promise<DidCrashOnPreviousExecutionResult>

Since: 0.1.0

sendUnsentReports()

sendUnsentReports() => Promise<void>

Uploads any unsent reports to Crashlytics at next startup.

When automatic data collection is enabled, Crashlytics automatically uploads reports at startup.

Only available for Android and iOS.

Since: 0.1.0

deleteUnsentReports()

deleteUnsentReports() => Promise<void>

Deletes any unsent reports on the device.

Only available for Android and iOS.

Since: 0.1.0

recordException(...)

recordException(options: RecordExceptionOptions) => Promise<void>

Records a non-fatal report to send to Crashlytics.

Only available for Android and iOS.

Since: 0.1.0

Interfaces

CrashOptions

CustomKeyAndValue

SetUserIdOptions

LogOptions

SetEnabledOptions

IsEnabledResult

DidCrashOnPreviousExecutionResult

RecordExceptionOptions

StackFrame

Subset of the Stacktrace generated by stacktrace.js.

Type Aliases

SetCustomKeyOptions

CustomKeyAndValue

Test your implementation

Here you can find more information on how to test the Firebase Crashlytics implementation. Among other things, you will find information on how to correctly adjust the project's debug settings under iOS and how to test it out.

If you get obfuscated crash reports for iOS, make sure you have initialized Crashlytics correctly and take a look at this guide, which provides some ways to troubleshoot if Crashlytics can't find your app's dSYM.

FAQ

Does this plugin work on the Web?

No, the plugin methods are only available on Android and iOS. Firebase Crashlytics itself does not provide a Web SDK, so crash reporting is limited to the native platforms.

How can I test my Crashlytics implementation?

Call the crash(...) method to force a test crash and verify that it shows up in the Firebase Console. Note that the report is usually sent on the next app start. More information on testing, including how to adjust your project's debug settings on iOS, can be found in the Test your implementation section.

How do I report handled JavaScript errors?

Use the recordException(...) method to record a non-fatal report. You can pass a stack trace generated by stacktrace.js via the stacktrace option to get readable JavaScript stack traces in the Firebase Console. Be aware that on iOS the code, domain and keysAndValues options are ignored if a stacktrace is provided.

Why are my iOS crash reports not human readable?

Crashlytics needs your project's debug symbol (dSYM) files to generate human readable crash reports on iOS. Follow the steps in the dSYM Upload section to automatically upload dSYM files to Firebase whenever you build your app.

Can I disable crash reporting until the user gives consent?

Yes, use the setEnabled(...) method to enable or disable automatic data collection at runtime. Note that the value does not apply until the next run of the app. You can then use sendUnsentReports() or deleteUnsentReports() to decide what happens with reports that have not been uploaded yet.

Can I use this plugin with Ionic, React, Vue or Angular?

Yes, the plugin is framework-agnostic. It works in any Capacitor app regardless of the web framework, including Ionic with Angular, React, or Vue, as well as plain JavaScript projects.

Related Plugins

• Firebase Analytics: Unofficial Capacitor plugin for Firebase Analytics.
• Firebase Performance Monitoring: Unofficial Capacitor plugin for Firebase Performance Monitoring.
• Firebase Remote Config: Unofficial Capacitor plugin for Firebase Remote Config.

Newsletter

Stay up to date with the latest news and updates about the Capawesome, Capacitor, and Ionic ecosystem by subscribing to our Capawesome Newsletter.

Changelog

See CHANGELOG.md.

License

See LICENSE.

Credits

This plugin is based on the Capacitor Community Firebase Crashlytics plugin. Thanks to everyone who contributed to the project!

[^1]: This project is not affiliated with, endorsed by, sponsored by, or approved by Google LLC or any of their affiliates or subsidiaries.