Working patch and test for getVariant

Author: aliu39

dev-packages/browser-integration-tests/suites/integrations/featureFlags/unleash/basic/test.ts

@@ -6,7 +6,7 @@ import { envelopeRequestParser, shouldSkipFeatureFlagsTest, waitForErrorRequest
 
 const FLAG_BUFFER_SIZE = 100; // Corresponds to constant in featureFlags.ts, in browser utils.
 
-sentryTest('Basic test with eviction, update, and no async tasks', async ({ getLocalTestUrl, page }) => {
+sentryTest('Basic isEnabled test with eviction, update, and no async tasks', async ({ getLocalTestUrl, page }) => {
   if (shouldSkipFeatureFlagsTest()) {
     sentryTest.skip();
   }
@@ -45,3 +45,43 @@ sentryTest('Basic test with eviction, update, and no async tasks', async ({ getL
 
   expect(event.contexts?.flags?.values).toEqual(expectedFlags);
 });
+
+sentryTest('Basic getVariant test with eviction, update, and no async tasks', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipFeatureFlagsTest()) {
+    sentryTest.skip();
+  }
+
+  await page.route('https://dsn.ingest.sentry.io/**/*', route => {
+    return route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify({ id: 'test-id' }),
+    });
+  });
+
+  const url = await getLocalTestUrl({ testDir: __dirname, skipDsnRouteHandler: true });
+  await page.goto(url);
+
+  await page.evaluate(bufferSize => {
+    const client = new (window as any).UnleashClient();
+    for (let i = 1; i <= bufferSize; i++) {
+      client.getVariant(`feat${i}`);
+    }
+    client.getVariant(`feat${bufferSize + 1}`); // eviction
+    client.getVariant('feat3'); // update
+  }, FLAG_BUFFER_SIZE);
+
+  const reqPromise = waitForErrorRequest(page);
+  await page.locator('#error').click();
+  const req = await reqPromise;
+  const event = envelopeRequestParser(req);
+
+  const expectedFlags = [{ flag: 'feat2', result: false }];
+  for (let i = 4; i <= FLAG_BUFFER_SIZE; i++) {
+    expectedFlags.push({ flag: `feat${i}`, result: false });
+  }
+  expectedFlags.push({ flag: `feat${FLAG_BUFFER_SIZE + 1}`, result: false });
+  expectedFlags.push({ flag: 'feat3', result: false });
+
+  expect(event.contexts?.flags?.values).toEqual(expectedFlags);
+});

packages/browser/src/integrations/featureFlags/unleash/integration.ts

@@ -2,22 +2,28 @@ import type { Client, Event, EventHint, IntegrationFn } from '@sentry/core';
 
 import { defineIntegration } from '@sentry/core';
 import { copyFlagsFromScopeToEvent, insertFlagToScope } from '../../../utils/featureFlags';
-import type { UnleashClient, UnleashClientClass } from './types';
+import type { IVariant, UnleashClient, UnleashClientClass } from './types';
 
 /**
- * Sentry integration for capturing feature flags from the Unleash SDK.
+ * Sentry integration for capturing feature flag evaluations from the Unleash SDK.
  *
  * See the [feature flag documentation](https://develop.sentry.dev/sdk/expected-features/#feature-flags) for more information.
  *
  * @example
  * ```
+ * import { UnleashClient } from 'unleash-proxy-client';
  * import * as Sentry from '@sentry/browser';
- * TODO:
+ *
+ * const unleashIntegration = Sentry.unleashIntegration(UnleashClient);
  *
  * Sentry.init({
  *   dsn: '___PUBLIC_DSN___',
- *   integrations: [TODO:]
+ *   integrations: [unleashIntegration],
  * });
+ *
+ * const unleashClient = new UnleashClient(...);
+ * unleashClient.isEnabled('my-feature');
+ * Sentry.captureException(new Error('something went wrong'));
  * ```
  */
 export const unleashIntegration = defineIntegration((unleashClientClass: UnleashClientClass) => {
@@ -29,6 +35,8 @@ export const unleashIntegration = defineIntegration((unleashClientClass: Unleash
     },
 
     setupOnce() {
+      const unleashClientPrototype = unleashClientClass.prototype as UnleashClient;
+
       const sentryIsEnabled = {
         apply: (
           target: (this: UnleashClient, toggleName: string) => boolean,
@@ -40,9 +48,23 @@ export const unleashIntegration = defineIntegration((unleashClientClass: Unleash
           return result;
         },
       };
-      const unleashClientPrototype = unleashClientClass.prototype as UnleashClient;
       const originalIsEnabled = unleashClientPrototype.isEnabled.bind(unleashClientPrototype);
       unleashClientPrototype.isEnabled = new Proxy(originalIsEnabled, sentryIsEnabled);
+
+      const sentryGetVariant = {
+        apply: (
+          target: (this: UnleashClient, toggleName: string) => IVariant,
+          thisArg: UnleashClient,
+          args: [toggleName: string],
+        ) => {
+          const variant = Reflect.apply(target, thisArg, args);
+          const result = variant.enabled;
+          insertFlagToScope(args[0], result);
+          return variant;
+        },
+      };
+      const originalGetVariant = unleashClientPrototype.getVariant.bind(unleashClientPrototype);
+      unleashClientPrototype.getVariant = new Proxy(originalGetVariant, sentryGetVariant);
     },
   };
 }) satisfies IntegrationFn;