JavaScript API to customize the widget behavior
When it comes to customizing and extending Feedbucket to suit your specific needs, the JavaScript API is your powerful ally. If you find that Feedbucket doesn't quite work the way you want it to, the JavaScript API provides a flexible solution to modify and enhance its functionalities.
With the JavaScript API, you have the freedom to tailor Feedbucket according to your preferences and build your own unique implementation. Whether you wish to fine-tune the controls or create entirely new features, the JavaScript API empowers you to unleash your creativity and take full control of Feedbucket's capabilities.
Methods
Feedbucket exposes certain methods for you to be able to interact with the widget.
Hide the controls
This method will hide the controls of Feedbucket. When we say controls we mean the buttons where you activate the features like screenshot, recording, etc.
const feedbucket = document.querySelector('feedbucket-app')
feedbucket._instance.exposed.hideControls()
If you want to hide the controls on the initial load you can do that by adding the feedbucketConfig object to window like below:
<script>
window.feedbucketConfig = {
hideControls: true
}
</script>
Show the controls
You can programatically show the controls again when they are hidden.
const feedbucket = document.querySelector('feedbucket-app')
feedbucket._instance.exposed.showControls()
Check the visibility state of controls
This method returns true or false depending on if the controls is showing or not.
const feedbucket = document.querySelector('feedbucket-app')
feedbucket._instance.exposed.isShowingControls()
Open a feature
If you want to open a feature. Available options for the feature parameter are: screenshot, record, portal, and help.
const feedbucket = document.querySelector('feedbucket-app')
const feature = 'screenshot' // screenshot, record, portal, and help
feedbucket._instance.exposed.openFeature(feature)
Close feature
If you want to programatically close the current opened feature you can do this:
const feedbucket = document.querySelector('feedbucket-app')
feedbucket._instance.exposed.closeFeatures()
Open a specific feedback in history
If you want to show a specific feedback in the History (View all feedback) section you can do that by providing an ID of the feedback to this method.
This can be great to use in companion with the feedbucketcreated event.
const feedbucket = document.querySelector('feedbucket-app')
const feedbackId = 1337 // The ID of the feedback you want to open.
feedbucket._instance.exposed.openFeedback(feedbackId)
Push events into the console log
Feedbucket is automatically capturing the console log events and other javascript errors. However, if you want to push some manual events into the log that might come from your own error logs you can do that.
const feedbucket = document.querySelector('feedbucket-app')
/**
* A string that can be either: info, error, log, warn.
*/
const type = 'info'
/**
* Either a string or an Object. If it's an Object, Feedbucket will make it into a String.
* Recommended to make it into a String yourself to control the value.
* Will be clipped by Feedbucket after 500 characters.
*/
const event = 'This is the string representation of our event.'
/**
* An integer or null.
* If you want to control the number of logs that Feedbucket will capture. As an example, if the
* log already contains 10 entries and you call the addConsoleLog method with a limit of 10.
* The oldest log will be removed from the entries and this new one will be placed on top,
* making it 10 entries as a max.
*/
const limit = 1000
feedbucket._instance.exposed.addConsoleLog(type, event, limit)
Events
Feedbucket sends events when certain actions are taken that you can listen to. Feedbucket will send the events to the window object of the host website.
Feedback created
Capture an event when feedback has been created.
window.addEventListener('feedbucketcreated', (event) => {
// Details about the feedback is in event.detail
console.log(event.detail)
})
Feature opened
Whenever a new feature is opened we send an event. The different features that can be opened in Feedbucket are Screenshot, Recording, and History.
window.addEventListener('feedbucketopenedfeature', (event) => {
// Will tell you what feature was opened
console.log(event.detail.feature)
})
Feature closed
Feedbucket will emit an event when a feature was closed.
window.addEventListener('feedbucketclosedfeatures', () => {
// This event does not have a payload.
})
FAQ & Known Issues
- Your team needs to be on the **Business Plan **to use the JavaScript API.
Updated on: 09/01/2026
Thank you!
