Options
All
  • Public
  • Public/Protected
  • All
Menu

Bugfender SDK

Bugfender Web SDK

Bugfender is a game-changing platform that logs every detail your users experience and feeds the data straight to an easy-to-use web console. Bugfender SDK is multi-platform and available for mobile and web apps, so you can use the same tool for all your apps.

This Bugfender SDK is for frontend projects written in JavaScript or TypeScript.

Sample Apps

We have created two sample apps you can use as reference:

Installation

Bugfender is designed to work both in the browser and in Node.js development environments (only for frontend).

NPM

Here are the main points to get Bugfender working on your apps:

npm install @bugfender/sdk

Then you can init and use the SDK:

// Import Bugfender
import { Bugfender } from '@bugfender/sdk';

// Initialize. `appKey` is the only required option.
Bugfender.init({
    appKey: '<YOUR_APP_KEY_HERE>',
    // apiURL: 'https://api.bugfender.com',
    // baseURL: 'https://dashboard.bugfender.com',
    // overrideConsoleMethods: true,
    // printToConsole: true,
    // registerErrorHandler: true,
    // logBrowserEvents: true,
    // logUIEvents: true,
    // version: '',
    // build: '',
});

// Bugfender now can be used
Bugfender.log('Hello world!');

Remember to change <YOUR_APP_KEY_HERE> with the app key of your app. For all the available options see our reference.

TypeScript

If you are writting an app using TypeScript, Bugfender includes a TypeScript definition file.

Browser

If you plan to use the SDK directly on your HTML/JS web page, you can import the SDK following these steps:

  • Get an app key at bugfender.com
  • Import Bugfender SDK JavaScript file
  • Init and use on your script
<script defer src="https://js.bugfender.com/bugfender.js"></script>
<script defer src="your-script.js"></script>

Note that to respect the loading order the script tags must have the defer attribute and not async. If async is used, the order is not guaranteed so there might be logs & errors from your app that Bugfender won't catch.

// your-script.js
// Bugfender will be registered in `window`
// Initialize. `appKey` is the only required option.
Bugfender.init({
    appKey: '<YOUR_APP_KEY_HERE>',
});

// Bugfender now can be used
Bugfender.log('Hello world!');

Remember to change <YOUR_APP_KEY_HERE> with the app key of your app. For all the available options see our reference.

Usage

Only after you have initialized the SDK you can start using it. For a complete API Reference visit the following URL: https://js.bugfender.com.

Send logs

The SDK provides the following methods to send logs to the server:

  • Bugfender.trace()
  • Bugfender.info()
  • Bugfender.log()
  • Bugfender.warn()
  • Bugfender.error()
  • Bugfender.fatal()

The signature of these methods is the same as the window.console equivalents.

Capturing console logs

Probably you might want to get all you app logs in your log viewer, to do this, when you init Bugfender you can enable the console override. For this there's the overrideConsoleMethods option you can enable/enable. By default the SDK will capture window.console calls.

Advanced Usage

Send issues

Bugfender allows you to send issues to the server. An issue is similar to a session but they are showed in the issues section and you can send issues any time from the app, even if the device is not enabled in the system. Issues are useful to keep track of important errors that you can detect in your code.

For sending an issue you can use the following function:

Bugfender.sendIssue('Issue title', 'Description of the issue');

Send logs with tags

Bugfender has a more advanced logging system that console.log() and allows you to add tags to the logs, adding a tag will allow you find and filter logs easily in the Bugfender log viewer.

Bugfender.sendLog({ tag: 'tag1', text: 'this is my log' });

Device associated data

You can associate information to a device as if it were a dictionary:

Bugfender.setDeviceKey('key', 'value');
Bugfender.removeDeviceKey('key');

You can find more information in our blog post Associated device information.

Collect User Feedback

Bugfender can collect User Feedback. User Feedback is similar to a session but they will show in the "User Feedback" section. You can send them any time from the app, even if the device is not enabled.

Bugfender.sendUserFeedback('Love the App!', 'You are doing a great job with it.')

Note: This SDK doesn't provide any UI yet. It might be added in the future.

Send a Crash manually

You can also manually send crash information. Usually you do not want to use this, enable automated crash reporting instead using the registerErrorHandler option. This will force all logs in the current session to be sent, even if log sending is disabled.

Bugfender.sendCrash('Crash Title', `Ops, the app crashed, better check what's wrong.`);

API Reference

For a complete API Reference you can visit: https://js.bugfender.com.

Other SDKs

Bugfender is also available in other platforms:

Learn more at Bugfender.

Generated using TypeDoc