BugDigger JavaScript API

BugDigger JavaScript API makes it easy to send data collected by a feedback widget in HTML page to BugDigger service.

JavaScript API is a simple client for BugDigger Service REST API - you may want to check the REST API documentation for more details.

For advanced usage built on a top of JavaScript API, see BugDigger Widget.

Including app.js

<script type="text/javascript" src="https://my.bugdigger.com/api.js"></script>

Add this script to your page to get started with BugDigger JS API.

Creating issue report object

var report = new BugDigger.Report(feedbackMessage);

or

var report = new BugDigger.Report(title, description);

The Report object provides a set of helper methods for initialization and submission of the issue report.

You can access the internal report.data object with data for submission to BugDigger service.

Add environment details

Use function:

report.addPageInfo();

or initialize environment block manually, optionally adding custom data:

report.data.environment = {
URL: document.location.href,
Referrer: document.referrer,
'App version': $('#version').text() // e.g. grab your app version if available in page
};

Although you can initialize the environment structure completely on the client side, you can also rely on BugDigger service adding data that can be obtained from your HTTP request:

report.data.collectBrowserInfoOnServer = true;

Add browser details

report.addBrowserInfo();

Function addBrowserInfo() will include details about the browser and installed browser plugins.

Add screenshot

report.addScreenshot(base64CodedImage, 'image/png');

or, you can simply pass result of the HTML Canvas element's toDataURL() call and BugDigger will take care about extracting content type and encoded image:

var imageData = canvas.toDataURL();
report.addScreenshot(imageData);

Add cookies

report.addCookies();

Add custom name-value set

report.addNameValueSet('Name of the set', {
'My data': 'Hello there...',
'Integer value': 123
});

Add current page source

report.addCurrentPageSource();

Include user information

// assuming the information available in page, you could do something like...
report.data.userName = $('#username').text();
report.data.userEmail = $('#useremail').text();

Submit issue report

Fire and forget:

report.send({apiKey: 'hAdrucevahatRayewrecRespu4rapusw8Yew2eje77Cr'}); // use your key!

Or provide callbacks to receive submission status:

report.send({
apiKey: 'hAdrucevahatRayewrecRespu4rapusw8Yew2eje77Cr', // use your key!
onSuccess: function(response) {
alert('Thank you for your feedback!');
//var reportId = response && response.issue ? response.issue.id : '?';
//alert('Upload completed. Report ID is ' + reportId);
},
onError: function(response) {
var msg = 'Error submitting issue report. ' + response.error;
alert(msg);
}
});
comments powered by Disqus