What this app does

The Bugpilot integration with Sentry makes it easy to collect easy-to-understand bug reports from your end users. With the Sentry app, you will be able to:

  • Share easy-to-understand bug reports with your non-technical colleagues.

  • Receive detailed bug reports automatically, including reliable visual proof and human-friendly steps to reproduce - whenever Sentry detects an exception.

  • Request additional screen recordings or screenshots from the users with just one click.

You can start using Bugpilot in less than 5 minutes by adding a couple of lines to your code.

How to set up the app

  1. Create an account at Bugpilot if you don't already have one.

  2. Add the Bugpilot tracking code to your website, in index.html.

  3. Find your index.js, or the module where you initialize your Sentry error reporting and follow the next steps.

Install the Bugpilot SDK package from npm:
npm i @bugpilot/sdk, or
yarn add @bugpilot/sdk

Import the integration from the @bugpilot/sdk package:

import { BugpilotSentryIntegration } from '@bugpilot/sdk';

Add the integration to the integrations property of Sentry.init:

// add new BugpilotSentryIntegration() to the integrations array;
// (note: you don't need to add BrowserTracing for Bugpilot to work)

integrations: [new BrowserTracing(), new BugpilotSentryIntegration()],

How to add the integration - Example

index.html (find this code in your Bugpilot dashboard)


How to use the app

That's it! ✨

Every time an exception is captured by Sentry, a Bugpilot report is automatically generated and saved.

If you use helpdesk software, such as Intercom, Zendesk, or Crisp, you can install one of our helpdesk integrations, so your Customer Support agents can instantly see Bugpilot reports directly from their user conversation page.

As usual, Bugpilot reports include the following:

  • up to 5 minutes of screen recording;

  • steps to reproduce;

  • detailed user information.

Code Example

We have prepared an example to show how to integrate Bugpilot with Sentry. You can check out this Replit project: Bugpilot Sentry Example.

The example is a standard create-react-app-like application, with no changes made except:

  • adding the Sentry SDK

  • public/index.html to include the usual Bugpilot tracking code

  • src/index.jsx to add the BugpilotSentryIntegration to Sentry's configuration

Did this answer your question?