Quick Start
Documentation is available in English. Перевод в процессе.
Capture your first bug report in under 5 minutes.
1. Initialize the SDK
import { BugSpotter } from '@bugspotter/sdk';
const bugspotter = await BugSpotter.init({
endpoint: 'https://api.bugspotter.io',
apiKey: 'bgs_your_api_key',
showWidget: true, // Floating bug report button
}); 2. Report a Bug
Click the floating widget button — or call capture() programmatically:
// Automatic: user clicks the widget → screenshot + replay + logs captured
// Programmatic: capture and submit
const report = await bugspotter.capture();
await bugspotter.submit({
title: 'Navigation broken on checkout',
description: 'User cannot proceed to payment',
priority: 'high',
report,
}); What Gets Captured
| Data | How |
|---|---|
| Screenshot | CSP-safe HTML-to-image, one click |
| Session Replay | Up to 30s rolling buffer via rrweb (15s default) |
| Console Logs | All levels (log, warn, error, info, debug) |
| Network Requests | URL, method, status, duration, timing |
| Browser Metadata | User agent, viewport, URL, OS |
Widget Customization
await BugSpotter.init({
apiKey: 'bgs_your_api_key',
endpoint: 'https://api.bugspotter.io',
showWidget: true,
widgetOptions: {
position: 'bottom-right', // or 'bottom-left'
text: 'Report Bug',
backgroundColor: '#d35400',
},
}); Production Usage
For production, use sampleRate to control overhead:
await BugSpotter.init({
apiKey: 'bgs_your_api_key',
endpoint: 'https://api.bugspotter.io',
sampleRate: 0.1, // Capture 10% of sessions
showWidget: false, // Hide widget in production
}); Next: Configuration →