### Customize Trigger Action to Start Recording
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Configure the `onTrigger` hook to immediately start a screen recording when the default button is clicked. This is useful for internal systems where quick reporting is desired.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
hooks: {
onTrigger: () => window.birdeatsbug.startRecording(),
},
})
```
--------------------------------
### Rename startSession to trigger
Source: https://docs.birdeatsbug.com/latest/sdk/migrations.html
Replace calls to `window.birdeatsbug.startSession()` with `window.birdeatsbug.trigger()` to ensure the SDK UI popup opens and recording starts.
```javascript
window.birdeatsbug.startSession()
```
```javascript
window.birdeatsbug.trigger()
```
--------------------------------
### Migrate Introduction Screen Options to Preview Screen Options
Source: https://docs.birdeatsbug.com/latest/sdk/migrations.html
Update your SDK configuration to use new preview screen options instead of the deprecated introduction screen options. This example shows how to require a screen recording and disallow screenshots.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
ui: {
introductionScreen: {
screenshotButton: false,
recordingButton: true,
skipButton: false,
},
},
})
```
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
ui: {
previewScreen: {
/* either screenshot or screen recording needs to be provided */
visualProof: 'required',
/* screenshot button is hidden, but screen recording is shown */
visualProofButtons: {
screenshot: false,
screenRecording: true,
},
},
},
})
```
--------------------------------
### Install Bird Eats Bug SDK
Source: https://docs.birdeatsbug.com/latest/sdk/installation.html
Copy and paste this snippet into your page's `
`. Ensure you replace `yourPublicAppId` with your actual Public App ID obtained from your workspace settings. Whitelist your domain in the workspace settings as well.
```html
```
```html
```
--------------------------------
### Redact URL Query Parameters
Source: https://docs.birdeatsbug.com/latest/reports/redact-sensitive-information.html
Use patterns to redact specific query parameters from URLs. The first example redacts all parameters, while the second targets the 'password' parameter specifically.
```regex
=[^=&?]*+
```
```regex
example\.com\/.*password=([^&]*)
```
--------------------------------
### Configure Sentry to Include Bird Eats Bug Session Link
Source: https://docs.birdeatsbug.com/latest/integrations/sentry.html
This configuration adds the Bird Eats Bug session URL to Sentry event payloads. Ensure Sentry is installed and Bird Eats Bug SDK or browser extension is available.
```javascript
const sentryConfig = {
// ...otherConfig
beforeSend: function (event) {
// Add the Bird Eats Bug session link to the payload, if it exists.
const birdeatsbugSessionURL = window.birdeatsbug?.session?.link || window.birdeatsbugExtension?.session?.link
if (birdeatsbugSessionURL) {
if (!event.contexts) event.contexts = {}
event.contexts['Bird Eats Bug'] = {
url: birdeatsbugSessionURL,
}
}
return event
},
}
```
--------------------------------
### Mutate Session Data Before Upload (Remove Password)
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Use the `beforeUpload` hook to modify session data before it's uploaded. This example demonstrates removing the `password` field from network request bodies to protect sensitive information.
```javascript
async function removePii(sessionData) {
sessionData.networkRequests = sessionData.networkRequests.map(request => {
if (request.requestBody?.password) {
delete request.requestBody.password
}
return request
})
return sessionData
}
window.birdeatsbug.setOptions({
/*...otherOptions, */
hooks: {
beforeUpload: removePii,
},
})
```
--------------------------------
### Configure Rollbar Payload with Bird Eats Bug Session URL
Source: https://docs.birdeatsbug.com/latest/integrations/rollbar.html
Add this configuration to your Rollbar setup to include the Bird Eats Bug session link in error payloads. This helps correlate Rollbar errors with user recordings.
```javascript
const rollbarConfig = {
// ...otherConfig
transform: function (payload) {
// Add the Bird Eats Bug session link to the payload, if it exists.
const birdeatsbugSessionURL = window.birdeatsbug?.session?.link || window.birdeatsbugExtension?.session?.link
if (birdeatsbugSessionURL) {
payload.birdeatsbugSessionURL = birdeatsbugSessionURL
}
return payload
},
}
```
--------------------------------
### Redact Click Event Data and Text
Source: https://docs.birdeatsbug.com/latest/reports/redact-sensitive-information.html
Hide sensitive data attributes and text content from click events. This example targets 'data-temporary-password' attributes and password phrases within the inner text.
```regex
data-temporary-password(.+)
```
```regex
password is \"(.+)\"
```
--------------------------------
### Disable Introduction Screen
Source: https://docs.birdeatsbug.com/latest/sdk/migrations.html
Update options to use hooks instead of setting `ui.introductionScreen` to `false` to disable the introduction screen.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
ui: {
introductionScreen: false,
},
})
```
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
hooks: {
onTrigger: () => window.birdeatsbug.startRecording(),
},
})
```
--------------------------------
### SDK Script Snippet (Default Async)
Source: https://docs.birdeatsbug.com/latest/sdk/performance.html
The default integrated script snippet loads the SDK asynchronously, preventing it from blocking the browser's rendering process. This is the recommended setting for optimal performance.
```html
```
--------------------------------
### Configure Form Input Fields
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Use the `setOptions` method to configure the visibility and requirement status of form fields on the session preview screen. This includes visual proof, email, title, description, and file attachments.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
ui: {
previewScreen: {
/* either screenshot or screen recording needs to be provided */
visualProof: 'required',
/* screenshot button is hidden, but screen recording is shown */
visualProofButtons: {
screenshot: false,
screenRecording: true,
},
/* email input needs to be filled */
email: 'required',
/* title input visible, but optional */
title: 'optional',
/* description textarea not visible */
description: false,
/* file attachment not visible */
fileAttachmentInputEnabled: false,
},
},
})
```
--------------------------------
### Enable Zendesk Integration
Source: https://docs.birdeatsbug.com/latest/integrations/zendesk.html
Configure the Bird SDK to enable the Zendesk integration. This will automatically open Zendesk and send Bird session links to customer support after a session is uploaded.
```javascript
window.birdeatsbug.setOptions({
/* ...otherOptions, */
integrations: {
zendesk: true,
},
})
```
--------------------------------
### Set UI Theme
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Change the theme of the default screens between 'dark' and 'light'. Set the `ui.theme` option.
```javascript
window.birdeatsbug.setOptions({
/* ... other options */
ui: {
theme: 'light',
},
})
```
--------------------------------
### Enable Instant Replay
Source: https://docs.birdeatsbug.com/latest/sdk/instant-replay.html
Enable instant replay with the following settings. This feature stores data on the user's computer and may require consent.
```javascript
window.birdeatsbug.setOptions({
/* ... other options */
instantReplay: true,
})
```
--------------------------------
### Hooks Options
Source: https://docs.birdeatsbug.com/latest/sdk/options.html
Integrate custom logic into the SDK's lifecycle events.
```APIDOC
## Hooks Options
Hook functions allow to define custom behavior within specific parts of the SDK lifecycle.
### Interface `HooksOptions`
- **afterInit** (function) - Called after the SDK is initialized.
- Parameters:
- **isBrowserSupported** (boolean)
- **isScreenshotSupported** (boolean)
- **isVideoRecordingSupported** (boolean)
- **triggerButtons** (HTMLElement[])
- **onTrigger** (function) - Promise - Called when the SDK trigger is activated.
- **afterTrigger** (function) - Called after the SDK trigger is activated.
- **beforeScreenshot** (function) - Called before a screenshot is taken.
- **beforeRecording** (function) - Called before recording starts.
- **afterScreenshot** (function) - Called after a screenshot is taken.
- Parameters:
- **sessionDataPromise** (Promise)
- **afterRecording** (function) - Called after recording finishes.
- Parameters:
- **sessionDataPromise** (Promise)
- **beforeUpload** (function) - Promise - Called before session data is uploaded.
- Parameters:
- **sessionData** (SessionData)
- **afterUpload** (function) - Promise - Called after session data is uploaded.
- Parameters:
- **sessionData** (SessionData)
- **afterClose** (function) - Called after the SDK is closed.
### Interface `SessionData`
- **session** (Session)
- **events** (array) - ClickEvent | ConsoleEvent | NavigationEvent
- **domEvents** (array) - DomEvent
- **networkRequests** (array) - NetworkEvent
- **screenshot** (string | undefined)
- **video** (string | undefined)
### Interface `Session`
- **id** (string)
- **title** (string | undefined)
- **description** (string | undefined)
- **hostname** (string)
- **userAgent** (string)
- **browserName** (string)
- **browserVersion** (string)
- **browserEngineName** (string)
- **browserEngineVersion** (string)
- **deviceType** (string)
- **deviceVendor** (string)
- **osName** (string)
- **osVersion** (string)
- **screenWidth** (number)
- **screenHeight** (number)
- **windowWidth** (number)
- **windowHeight** (number)
- **locale** (string)
- **startedAt** (string | undefined)
- **internetSpeedInMbps** (number | undefined)
- **internetLatencyInMs** (number | undefined)
- **uploaderEmail** (string | undefined)
- **uploadMethod** (string) - 'sdk'
- **link** (string | undefined)
- **videoMimeType** (string | undefined)
- **videoDuration** (number | undefined)
- **videoWidth** (string | undefined)
- **videoHeight** (string | undefined)
```
--------------------------------
### UI Options Interface
Source: https://docs.birdeatsbug.com/latest/sdk/options.html
Defines the structure for customizing the SDK's user interface, including theme, positioning, and text content.
```typescript
interface UIOptions {
theme: 'light' | 'dark' = 'dark'
position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' = 'bottom-right'
watermark: boolean = true
defaultButton:
| {
icon: 'brand' | 'exclamation' | false = 'brand'
}
| false = {
icon: 'brand',
}
recordingControls: boolean = true
previewScreen:
| {
visualProof: 'optional' | 'required' | false = 'optional'
visualProofButtons: {
screenshot: boolean = true
screenRecording: boolean = true
} = {
screenshot: true,
screenRecording: true,
}
email: 'optional' | 'required' | false = 'required'
title: 'optional' | 'required' | false = 'optional'
description: 'optional' | 'required' | false = 'optional'
fileAttachmentInputEnabled: boolean = false
}
| false = {
visualProof: 'optional',
visualProofButtons = {
screenshot: true,
screenRecording: true,
},
email: 'required',
title: 'optional',
description: 'optional',
}
submitConfirmationScreen:
| {
sessionLink: boolean
}
| false = {
sessionLink: false,
}
text: {
defaultButton: string = 'Report a bug'
dismissButton: string = 'Dismiss'
recordingControls: {
starting: string = 'Starting...'
recording: string = 'Recording...'
recordingProgress: string = 'Recording for'
stopRecordingButton: string = 'Stop recording'
}
previewScreen: {
title: string = 'Report a bug'
visualProofMissingErrorMessage: string = 'Please add a visual proof to complete your report.'
startScreenRecordingButton: string = 'Start recording'
takeScreenshotButton: string = 'Take screenshot'
replaceVisualProofButton: string = 'Replace'
removeVisualProofButton: string = 'Remove'
confirmVisualProofRemovalButton: string = 'Confirm removal'
cancelButton: string = 'Cancel'
emailInputPlaceholder: string = 'Add an email'
titleInputPlaceholder: string = 'Add a title'
descriptionInputPlaceholder: string = 'Add a description'
collectionInputPlaceholder: string = 'Select collection'
labelInputPlaceholder: string = 'Select labels'
inputOptional: string = 'optional'
submitButton: string = 'Submit'
uploadError: string = 'Error. Try again'
}
submitConfirmationScreen: {
title: string = 'Bug report submitted'
message: string = 'Thanks for reporting this issue to us. A member of the team will investigate this and get back to you soon.'
copyLink: string = 'Copy link to your bug report'
copiedLink: string = '✓ Link copied!'
confirmationButton: string = 'Close'
}
}
}
```
--------------------------------
### UI Options
Source: https://docs.birdeatsbug.com/latest/sdk/options.html
Customize the appearance, text, and flow of the SDK's user interface.
```APIDOC
## UI Options
UI options allow to customize the look, displayed copy, and screen flow.
### Interface `UIOptions`
- **theme** (string) - Optional - 'light' | 'dark' = 'dark'
- **position** (string) - Optional - 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' = 'bottom-right'
- **watermark** (boolean) - Optional = true
- **defaultButton** (object | boolean) - Optional = { icon: 'brand' }
- **icon** (string) - Optional - 'brand' | 'exclamation' | false = 'brand'
- **recordingControls** (boolean) - Optional = true
- **previewScreen** (object | boolean) - Optional = { visualProof: 'optional', email: 'required', title: 'optional', description: 'optional' }
- **visualProof** (string) - Optional - 'optional' | 'required' | false = 'optional'
- **visualProofButtons** (object) - Optional = { screenshot: true, screenRecording: true }
- **screenshot** (boolean) - Optional = true
- **screenRecording** (boolean) - Optional = true
- **email** (string) - Optional - 'optional' | 'required' | false = 'required'
- **title** (string) - Optional - 'optional' | 'required' | false = 'optional'
- **description** (string) - Optional - 'optional' | 'required' | false = 'optional'
- **fileAttachmentInputEnabled** (boolean) - Optional = false
- **submitConfirmationScreen** (object | boolean) - Optional = { sessionLink: false }
- **sessionLink** (boolean) - Optional
- **text** (object)
- **defaultButton** (string) - Optional = 'Report a bug'
- **dismissButton** (string) - Optional = 'Dismiss'
- **recordingControls** (object)
- **starting** (string) - Optional = 'Starting...'
- **recording** (string) - Optional = 'Recording...'
- **recordingProgress** (string) - Optional = 'Recording for'
- **stopRecordingButton** (string) - Optional = 'Stop recording'
- **previewScreen** (object)
- **title** (string) - Optional = 'Report a bug'
- **visualProofMissingErrorMessage** (string) - Optional = 'Please add a visual proof to complete your report.'
- **startScreenRecordingButton** (string) - Optional = 'Start recording'
- **takeScreenshotButton** (string) - Optional = 'Take screenshot'
- **replaceVisualProofButton** (string) - Optional = 'Replace'
- **removeVisualProofButton** (string) - Optional = 'Remove'
- **confirmVisualProofRemovalButton** (string) - Optional = 'Confirm removal'
- **cancelButton** (string) - Optional = 'Cancel'
- **emailInputPlaceholder** (string) - Optional = 'Add an email'
- **titleInputPlaceholder** (string) - Optional = 'Add a title'
- **descriptionInputPlaceholder** (string) - Optional = 'Add a description'
- **collectionInputPlaceholder** (string) - Optional = 'Select collection'
- **labelInputPlaceholder** (string) - Optional = 'Select labels'
- **inputOptional** (string) - Optional = 'optional'
- **submitButton** (string) - Optional = 'Submit'
- **uploadError** (string) - Optional = 'Error. Try again'
- **submitConfirmationScreen** (object)
- **title** (string) - Optional = 'Bug report submitted'
- **message** (string) - Optional = 'Thanks for reporting this issue to us. A member of the team will investigate this and get back to you soon.'
- **copyLink** (string) - Optional = 'Copy link to your bug report'
- **copiedLink** (string) - Optional = '✓ Link copied!'
- **confirmationButton** (string) - Optional = 'Close'
```
--------------------------------
### SDK Options Interface
Source: https://docs.birdeatsbug.com/latest/sdk/options.html
Defines the structure for SDK options, including mandatory and optional properties for session recording and user identification.
```typescript
interface SDKOptions extends SDKDefaultOptions {
publicAppId: string
instantReplay?: boolean = false
recordVideo?: boolean = false
user?: {
email?: string
}
integrations?: IntegrationOptions
ui?: UIOptions
hooks?: HooksOptions
recordedEventTypes?: {
[key in RecordedEventTypesOptions]: boolean
}
}
```
--------------------------------
### SDK Script Snippet (Synchronous Loading)
Source: https://docs.birdeatsbug.com/latest/sdk/performance.html
For scenarios where perfect bug report fidelity during internal testing is prioritized over performance, the 'async' attribute can be removed from the script snippet. This ensures that a larger portion of the page load process is recorded by the SDK.
```html
```
--------------------------------
### Integration Options Interface
Source: https://docs.birdeatsbug.com/latest/sdk/options.html
Specifies the configuration options for integrating the SDK with external tools like Intercom and Zendesk.
```typescript
interface IntegrationOptions {
intercom?: boolean = false
zendesk?: boolean = false
}
```
--------------------------------
### Configure Max Network Response Body Size (SDK)
Source: https://docs.birdeatsbug.com/latest/troubleshoot/network.html
Set the maximum recorded response body size to 2MB using the SDK. This option is part of the `recordedEventTypes` configuration.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
recordedEventTypes: {
/* ...other event types */
network: {
maxSizeInBytes: 2000000,
} /* set maximum recorded response body size to 2mb */,
},
})
```
--------------------------------
### Set User Email in SDK
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Pre-fill the email field on the session preview screen by passing the user's email address to the `setOptions` method. This is useful if the email field is configured to be visible.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
user: {email: 'feedback@birdeatsbug.com'},
})
```
--------------------------------
### Enable Intercom Integration
Source: https://docs.birdeatsbug.com/latest/integrations/intercom.html
Configure the Bird SDK to enable the Intercom integration. This allows users to automatically send Bird session links to customer support via Intercom after uploading a session.
```javascript
window.birdeatsbug.setOptions({
/* ...otherOptions, */
integrations: {
intercom: true,
},
})
```
--------------------------------
### Enable Session Link Copy on Submit Confirmation Screen
Source: https://docs.birdeatsbug.com/latest/sdk/migrations.html
Configure the SDK to show the session link copy option on the submit confirmation screen. This is useful for internal use cases where bug reporters are workspace members.
```javascript
window.birdeatsbug.setOptions({
/* ... other options */
ui: {
submitConfirmationScreen: {sessionLink: true},
},
})
```
--------------------------------
### Mutate Session Data Before Upload (Prefix Session Title)
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Leverage the `beforeUpload` hook to prepend 'SDK: ' to all session titles. This allows for easy identification of sessions reported via the SDK.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
hooks: {
beforeUpload: sessionData => {
if (sessionData.session.title) {
sessionData.session.title = 'SDK: ' + sessionData.session.title
}
return sessionData
},
},
})
```
--------------------------------
### Customize Trigger Action to Take Screenshot
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Configure the `onTrigger` hook to take a screenshot immediately when the default button is clicked. This provides a faster way for users to report issues.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
hooks: {
onTrigger: () => window.birdeatsbug.takeScreenshot(),
},
})
```
--------------------------------
### Configure Bugsnag to Add Bird Eats Bug Session Link
Source: https://docs.birdeatsbug.com/latest/integrations/bugsnag.html
Add this configuration to your Bugsnag initialization to include the Bird Eats Bug session URL in error payloads. This helps correlate Bugsnag errors with user recordings.
```javascript
Bugsnag.start({
// ...otherOptions
onError: function (event) {
// Add the Bird Eats Bug session link to the payload, if it exists.
const birdeatsbugSessionURL = window.birdeatsbug?.session?.link || window.birdeatsbugExtension?.session?.link
if (birdeatsbugSessionURL) {
event.addMetadata('Bird Eats Bug', {link: birdeatsbugSessionURL})
}
},
})
```
--------------------------------
### TypeScript Interface for Recorded Event Types
Source: https://docs.birdeatsbug.com/latest/sdk/options.html
Defines the structure and default values for configuring which event types the SDK records. This interface specifies boolean flags for most event types and allows for detailed configuration of network and console logging.
```typescript
interface RecordedEventTypesOptions {
click: boolean = true
keystrokes: boolean = true
'error-uncaught': boolean = true
'error-promise': boolean = true
localStorage: boolean = true
sessionStorage: boolean = true
network:
| false
| Partial<{
maxSizeInBytes: number = 100000
}> = {
maxSizeInBytes: number = 100000
}
dom: boolean | object = true
console:
| false
| Partial<{
debug: boolean = true
log: boolean = true
info: boolean = true
warn: boolean = true
error: boolean = true
assert: boolean = true
trace: boolean = true
dir: boolean = true
group: boolean = true
table: boolean = true
count: boolean = true
profile: boolean = true
time: boolean = true
}> = {
debug: true,
log: true,
info: true,
warn: true,
error: true,
assert: true,
trace: true,
dir: true,
group: true,
table: true,
count: true,
profile: true,
time: true,
}
}
```
--------------------------------
### Configure Intercom Identity Verification
Source: https://docs.birdeatsbug.com/latest/integrations/intercom.html
Set up the `user_hash` for Intercom's Identity Verification when a user uploads a session. This ensures the correct user is associated with the bug report in Intercom.
```javascript
window.birdeatsbug.setOptions({
/* ...otherOptions, */
ui: {
previewScreen: {
/* email input needs to be filled */
email: 'required',
},
},
hooks: {
afterUpload: async function setIntercomUserHash({session}) {
// the function getUserHashForEmail would probably have to make a call to your back end to get the hash
const user_hash = await getUserHashForEmail(session.uploaderEmail)
window.intercomSettings.user_hash = user_hash
},
},
integrations: {
intercom: true,
},
})
```
--------------------------------
### Hooks Options Interface
Source: https://docs.birdeatsbug.com/latest/sdk/options.html
Defines the structure for hook functions that allow custom behavior at specific points in the SDK lifecycle.
```typescript
interface HooksOptions {
afterInit({
isBrowserSupported,
isScreenshotSupported,
isVideoSupported,
triggerButtons,
}: {
isBrowserSupported: boolean
isScreenshotSupported: boolean
isVideoSupported: boolean
triggerButtons: HTMLElement[]
}): void
onTrigger(): Promise
afterTrigger(): void
beforeScreenshot(): void
beforeRecording(): void
afterScreenshot(sessionDataPromise: Promise): void
afterRecording(sessionDataPromise: Promise): void
beforeUpload(sessionData: SessionData): Promise
afterUpload(sessionData: SessionData): Promise
afterClose(): void
}
interface SessionData {
session: Session
events: (ClickEvent | ConsoleEvent | NavigationEvent)[]
domEvents: DomEvent[]
networkRequests: NetworkEvent[]
screenshot: undefined | string
video: undefined | string
}
interface Session {
id: string
title?: string
description?: string
hostname: string
userAgent: string
browserName: string
browserVersion: string
browserEngineName: string
browserEngineVersion: string
deviceType: string
deviceVendor: string
osName: string
osVersion: string
screenWidth: number
screenHeight: number
windowWidth: number
windowHeight: number
locale: string
startedAt?: ReturnType
internetSpeedInMbps?: number
internetLatencyInMs?: number
uploaderEmail?: string
uploadMethod: 'sdk'
link?: string
videoMimeType?: string
videoDuration?: number
videoWidth?: string
videoHeight?: string
}
```
--------------------------------
### Add Custom Trigger Element
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Use the `data-birdeatsbug="trigger"` attribute on any HTML element to make it trigger the SDK flow. This is suitable for static sites.
```html
```
--------------------------------
### Rollbar Service Link Configuration
Source: https://docs.birdeatsbug.com/latest/integrations/rollbar.html
Configure this text in Rollbar to display the Bird Eats Bug session URL as a service link. This allows direct access to the user's recording from Rollbar.
```text
{{birdeatsbugSessionURL}}
```
--------------------------------
### Customize DOM Recording Options with rrweb
Source: https://docs.birdeatsbug.com/latest/troubleshoot/dom.html
Pass custom rrweb options to mask password fields when recording DOM mutations. This is useful for enhancing privacy in recordings.
```javascript
window.birdeatsbug.setOptions({
/* ... other options */
recordedEventTypes: {
/* pass custom rrweb options: */
dom: {
/* mask password fields, see https://github.com/rrweb-io/rrweb/blob/master/guide.md#privacy */
maskInputOptions: {password: true},
},
},
})
```
--------------------------------
### Skip Success Screen After Session Upload
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Set `submitConfirmationScreen` to `false` to automatically skip the success screen after a session upload. This is useful for internal use cases or when integrations like Intercom or Zendesk are enabled.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
ui: {
submitConfirmationScreen: false,
},
})
```
--------------------------------
### Change UI Text
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Customize the text displayed in UI elements, such as the default button label. Set the `ui.text` option with custom string values for available keys.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
ui: {
text: {
defaultButton: 'Report feedback',
},
},
})
```
--------------------------------
### Redact User IDs and File Paths in Errors
Source: https://docs.birdeatsbug.com/latest/reports/redact-sensitive-information.html
Redact user identifiers and source file paths from error messages and stack traces. The patterns target specific prefixes and file extensions.
```regex
auth0\|(.+)
```
```regex
\/([^\/]+)\.js
```
--------------------------------
### Add Custom Trigger Programmatically
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
For single page applications, programmatically add triggers by creating an element, attaching the `window.birdeatsbug.trigger` function as a click handler, and appending it to the DOM. Ensure the browser supports the SDK before adding triggers.
```javascript
if (window.birdeatsbug.isBrowserSupported) {
const customButton = document.createElement('button')
customButton.innerText = 'Share feedback'
customButton.addEventListener('click', window.birdeatsbug.trigger)
document.body.appendChild(customButton)
}
```
--------------------------------
### Customize Default Button Position
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Set the position of the default feedback button to one of the four corners of the browser. Use the `ui.position` option.
```javascript
window.birdeatsbug.setOptions({
/* ... other options */
ui: {
/* can be set to 'top-right', 'top-left', 'bottom-right', or 'bottom-left' */
position: 'top-right',
},
})
```
--------------------------------
### Disable Watermark
Source: https://docs.birdeatsbug.com/latest/sdk/customization.html
Set the `ui.watermark` option to `false` to disable the "Bird Eats Bug" branding.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
ui: {
watermark: false,
},
})
```
--------------------------------
### Disable Network Request Recording (SDK)
Source: https://docs.birdeatsbug.com/latest/troubleshoot/network.html
Completely disable the recording of network requests by setting the `network` option to `false` within `recordedEventTypes` in the SDK configuration.
```javascript
window.birdeatsbug.setOptions({
/*...otherOptions, */
recordedEventTypes: {
/* ...other event types */
network: false /* disable recording of network requests */,
},
})
```