JavaScript SDK
Overview
The official NPM module for embedding the Userback Widget into your JavaScript or TypeScript application.
Official NPM Package
https://www.npmjs.com/package/@userback/widget
Official Github Repository
https://github.com/userback/widget-js/tree/develop/widget-js
Installation
Userback Widget Token
You will need your Userback Widget Token, you can get your project-specific Userback Widget Token from Widget Customiser.
We've got 2 options, utilizing NPM or Yarn in the code example below.
npm i @userback/widget
yarn add @userback/widget
Quickstart
import Userback from '@userback/widget'
Userback('**USERBACK_TOKEN**')
Examples
Show the Userback Widget immediately after loading on the bug screen.
Userback(..).then(ub => {
ub.show('bug')
})
Or delay showing it until later:
Userback(.., { autohide: true }).then(ub => {
document.querySelector('button.show-feedback').addEventListener('click', function(){
ub.show()
})
})
Using the options object to enable native screenshots while binding screenshots to a HTML button:
const userback = await Userback(..., { navtive_screenshot: true })
document.querySelector('button.screenshot').addEventListener('click', (event) => {
event.preventDefault()
userback.open('bug', 'screenshot')
})
After initialization, you can use the named function getUserback
to get a reference to the UserbackWidget.
import { getUserback } from '@userback/widget'
document.querySelector('button.screenshot').addEventListener('click', (event) => {
event.preventDefault()
getUserback().open('bug', 'screenshot')
})
For more information about available configuration settings and and functions available, see our JavaScript API
Updated 9 months ago