diff --git a/docs/platforms/javascript/common/configuration/integrations/statsig.mdx b/docs/platforms/javascript/common/configuration/integrations/statsig.mdx new file mode 100644 index 00000000000000..de7ec53a68fdb4 --- /dev/null +++ b/docs/platforms/javascript/common/configuration/integrations/statsig.mdx @@ -0,0 +1,40 @@ +--- +title: Statsig +description: "Learn how to use Sentry with Statsig." +notSupported: + - javascript.aws-lambda + - javascript.azure-functions + - javascript.bun + - javascript.capacitor + - javascript.cloudflare + - javascript.connect + - javascript.cordova + - javascript.deno + - javascript.electron + - javascript.express + - javascript.fastify + - javascript.gcp-functions + - javascript.hapi + - javascript.koa + - javascript.nestjs + - javascript.node + - javascript.wasm +--- + + + + + +This integration only works inside a browser environment. It is only available from a package-based install (e.g. `npm` or `yarn`). + + + +The [Statsig](https://www.statsig.com/) integration tracks feature flag evaluations produced by the Statsig JavaScript Client SDK. These evaluations are held in memory, and in the event an error occurs, sent to Sentry for review and analysis. **At the moment, we only support boolean flag evaluations from Statsig's `checkGate` method**. Learn more about [Statsig feature gates](https://docs.statsig.com/feature-flags/working-with/). + +This integration is available in Sentry SDK **versions 9.0.0 and higher**, or **versions 8.55.0 and higher for v8.** + +_Import name: `Sentry.statsigIntegration`_ + + + + diff --git a/docs/platforms/javascript/common/feature-flags/index.mdx b/docs/platforms/javascript/common/feature-flags/index.mdx index dd577dc9e26edd..09d45bdaab58dd 100644 --- a/docs/platforms/javascript/common/feature-flags/index.mdx +++ b/docs/platforms/javascript/common/feature-flags/index.mdx @@ -35,6 +35,7 @@ Evaluation tracking requires enabling an SDK integration. Integrations are provi - [Generic](/platforms/javascript/configuration/integrations/featureflags/) - [LaunchDarkly](/platforms/javascript/configuration/integrations/launchdarkly/) - [OpenFeature](/platforms/javascript/configuration/integrations/openfeature/) +- [Statsig](/platforms/javascript/configuration/integrations/statsig/) - [Unleash](/platforms/javascript/configuration/integrations/unleash/) ## Enable Change Tracking diff --git a/platform-includes/configuration/integrations/javascript.mdx b/platform-includes/configuration/integrations/javascript.mdx index e534fc4d4c43ab..61d8b6cf3b6a99 100644 --- a/platform-includes/configuration/integrations/javascript.mdx +++ b/platform-includes/configuration/integrations/javascript.mdx @@ -25,4 +25,5 @@ | [`replayIntegration`](./replay) | | | | ✓ | ✓ | | [`replayCanvasIntegration`](./replaycanvas) | | | | ✓ | | | [`reportingObserverIntegration`](./reportingobserver) | | ✓ | | | | +| [`statsigIntegration`](./statsig) | | | | | ✓ | | [`unleashIntegration`](./unleash) | | | | | ✓ | diff --git a/platform-includes/configuration/statsig/javascript.angular.mdx b/platform-includes/configuration/statsig/javascript.angular.mdx new file mode 100644 index 00000000000000..5e40a15ddf45fe --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.angular.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/angular'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.astro.mdx b/platform-includes/configuration/statsig/javascript.astro.mdx new file mode 100644 index 00000000000000..e9dc64f8c6c74f --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.astro.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/astro'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.ember.mdx b/platform-includes/configuration/statsig/javascript.ember.mdx new file mode 100644 index 00000000000000..e359ccb64ff6a5 --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.ember.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/ember'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.gatsby.mdx b/platform-includes/configuration/statsig/javascript.gatsby.mdx new file mode 100644 index 00000000000000..304f3c9a146ed2 --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.gatsby.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/gatsby'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.mdx b/platform-includes/configuration/statsig/javascript.mdx new file mode 100644 index 00000000000000..cfae3819cdf88d --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/browser'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.nextjs.mdx b/platform-includes/configuration/statsig/javascript.nextjs.mdx new file mode 100644 index 00000000000000..33bbcbe28dd787 --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.nextjs.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/nextjs'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.nuxt.mdx b/platform-includes/configuration/statsig/javascript.nuxt.mdx new file mode 100644 index 00000000000000..9349ee9616f61d --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.nuxt.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/nuxt'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.react.mdx b/platform-includes/configuration/statsig/javascript.react.mdx new file mode 100644 index 00000000000000..9af3335a115858 --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.react.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/react'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.remix.mdx b/platform-includes/configuration/statsig/javascript.remix.mdx new file mode 100644 index 00000000000000..70d716204a90f6 --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.remix.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/remix'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.solid.mdx b/platform-includes/configuration/statsig/javascript.solid.mdx new file mode 100644 index 00000000000000..d93a5cff80db6c --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.solid.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/solid'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.solidstart.mdx b/platform-includes/configuration/statsig/javascript.solidstart.mdx new file mode 100644 index 00000000000000..00d862edf2308c --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.solidstart.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/solidstart'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.svelte.mdx b/platform-includes/configuration/statsig/javascript.svelte.mdx new file mode 100644 index 00000000000000..2b3980fc2e802f --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.svelte.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/svelte'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.sveltekit.mdx b/platform-includes/configuration/statsig/javascript.sveltekit.mdx new file mode 100644 index 00000000000000..1d7c8d7412aa9d --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.sveltekit.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/sveltekit'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false". diff --git a/platform-includes/configuration/statsig/javascript.vue.mdx b/platform-includes/configuration/statsig/javascript.vue.mdx new file mode 100644 index 00000000000000..32d05783be00de --- /dev/null +++ b/platform-includes/configuration/statsig/javascript.vue.mdx @@ -0,0 +1,20 @@ +Before using this integration, you need to install and instrument Statsig in your app. Learn more by reading [Statsig's SDK reference](https://docs.statsig.com/client/javascript-sdk) and [quickstart guide](https://docs.statsig.com/guides/first-feature). + +```javascript +import * as Sentry from '@sentry/vue'; +import { StatsigClient } from '@statsig/js-client'; + +const statsigClient = new StatsigClient( YOUR_SDK_KEY, { userID: 'my-user-id' }, {} ); // see Statsig SDK reference. + +Sentry.init({ + dsn: '___PUBLIC_DSN___', + integrations: [Sentry.statsigIntegration({featureFlagClient: statsigClient})], +}); + +await statsigClient.initializeAsync(); // or statsigClient.initializeSync(); + +const result = statsigClient.checkGate('my-feature-gate'); +Sentry.captureException(new Error('something went wrong')); +``` + +Visit the Sentry website and confirm that your error event has recorded the feature flag "my-feature-gate" and its value "false".