For AI agents: a documentation index is available at the root level at /llms.txt and /llms-full.txt. Append /llms.txt to any URL for a page-level index, or .md for the markdown version of any page.
Sign inTry it free
DocsGuidesSDKsIntegrationsAPI docsTutorialsFlagship blog
DocsGuidesSDKsIntegrationsAPI docsTutorialsFlagship blog
  • Integrations
    • Collaboration tools
    • Data Export
    • Edge tools
    • Environments as a service
    • Experimentation and metric integrations
    • Internal developer platforms
    • Monitoring tools
    • Segments integrations
    • Workflow management tools
    • More integrations
      • Ansible Collection
      • AWS CloudTrail Lake
      • AWS PrivateLink
      • Bitbucket Pipelines
      • Bitrise Release Management
      • CloudQuery
      • Contentful
      • Convex
      • Crossplane
      • Ditto
      • FullStory
      • GitHub Actions
      • Kosli
      • ngrok
      • Osano
      • Terraform
      • Zendesk
    • Managing integrations
    • Using the LaunchDarkly integration framework
    • Building partner integrations
Sign inTry it free
LogoLogo
On this page
  • Set up the integration
IntegrationsMore integrations

FullStory

Was this page helpful?
Previous

GitHub Actions

Next
Built with
FullStory SDK Requirements

The FullStory integration requires the LaunchDarkly JavaScript SDK version 2.24 or higher, or the React Web SDK version 2.27 or higher.

This topic explains how to set up and use the LaunchDarkly FullStory integration. The integration sends LaunchDarkly flag evaluations as FullStory page properties.

FullStory combines analytics with high-fidelity session replay and intelligent diagnostics so you can fix issues impacting your customers’ experience, even if the issues are not reported by customers.

To learn more about the use case for this integration, read LaunchDarkly + FullStory: Targeted User Observability on the LaunchDarkly blog.

Set up the integration

The code below can be modified to fit your setup.

Here’s how to get started:

  • Install and configure the FullStory client
  • Use the setVars API to send the evaluated flags to FullStory page properties

In the example below, evaluatedSessionFlags is a two-level map. The first key is the url path. The second key is the flag key. The final values are based on the return value of the feature flag:

Inspector Setup
1// instantiate the path to flags mapping object outside of the Inspector
2const evaluatedSessionFlags: { [path: string]: { [flagKey: string]: unknown } } = {};
3
4const fsInspector: LDInspection {
5  {
6    type: 'flag-used',
7    name: 'fullstory-inspector',
8    method: (key: string, detail: LDEvaluationDetail) => {
9
10      // FullStory attaches getCurrentSessionURL and setVars to the window object.
11      // https://help.fullstory.com/hc/en-us/articles/1500004101581-FS-setVars-API-Sending-custom-page-data-to-FullStory
12      if (window.FS === undefined || typeof window.FS.getCurrentSessionURL !== 'function') {
13        return;
14      }
15
16      const url = window.FS.getCurrentSessionURL(true);
17      if (url === undefined) {
18        return;
19      }
20
21      evaluatedSessionFlags[url] = {
22        ...evaluatedSessionFlags[url],
23        [key]: detail.value,
24      };
25
26      const arrayOfFlags = Object.keys(evaluatedSessionFlags[url]).map(
27        (flagKey) => `${flagKey}=${JSON.stringify(evaluatedSessionFlags[url][flagKey], null, 1)}`,
28      );
29
30      if (typeof window.FS.setVars === 'function') {
31        window.FS.setVars('page', { ldflags: arrayOfFlags }, {integration:"launchdarkly"});
32      }
33    },
34  },
35}
36const options = { inspectors: [fsInspector] };
37const client = LDClient.initialize('example-client-side-id', context, options);