Star us on GitHub
Star
Menu

Client SDK API Reference

Client SDK

The Highlight client records and sends session data to Highlight. The Highlight client SDK contains functions to configure your recording, start and stop recording, and add custom user metadata and properties.

Just getting started?

Check out our getting started guide to get up and running quickly.

H.init

This method is called to initialize Highlight in your application.

Method Parameters
H.init("<YOUR_PROJECT_ID>", { // Your config options here... });
Copy

H.identify

This method is used to add an identity to a user for the session. You can learn more in Identifying Users.

Method Parameters
H.identify("alice@corp.com", { highlightDisplayName: "Alice Customer", accountType: "premium", hasUsedFeature: true });
Copy

H.track

This method is used to track events that happen during the session. You can learn more in Tracking Events.

Method Parameters
H.track("Opened Shopping Cart", { accountType: "premium", cartSize: 10 });
Copy

H.consumeError

This method is used to send a custom error to Highlight.

Method Parameters
H.consumeError(error, 'Error in Highlight custom boundary!', { component: 'JustThroughAnError.tsx', });
Copy

H.metrics

This method is used to submit custom metrics.

Method Parameters
H.metrics([{ name: 'clicks', value: 1, tags: [{ browser }] }, { name: 'auth_time', value: authDelay, tags: [{ version: 'v2' }] }
Copy

H.getSessionDetails

This method is used to get the Highlight session URL. This method provides the same URL as H.getSessionUrl() but this also gives you a URL for the exact time (relative to the session recording) the method is called. For example, an error is thrown in your app and you want to save the Highlight session URL to another app (Mixpanel, Sentry, Amplitude, etc.). If you just want a URL to the session, you can save url. If you want a URL that sets the player to the time of when the error is called, you can save urlWithTimestamp.

H.getSessionDetails().then(({url, urlWithTimestamp}) => { console.log(url, urlWithTimestamp); });
Copy

H.getSessionURL

This method is used to get the Highlight session URL for the current recording session. This is useful to use if you'd like to send the session URL to another application. See H.getSessionDetails() if you want to get the URL with the current time.

const highlightSessionUrl = await H.getSessionURL(); thirdPartyApi.setMetadata({ highlightSessionUrl });
Copy

H.start

This method is used to start Highlight if H.init() was called with manualStart set to true.

Method Parameters
H.init("<YOUR_PROJECT_ID>", { manualStart: true }); // Elsewhere in your app H.start({ silent: false });
Copy

H.stop

This method is used to stop Highlight from recording. Recording can be resumed later by calling H.start().

H.init("<YOUR_PROJECT_ID>"); // Elsewhere in your app H.stop();
Copy