diff --git a/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/basic/test.ts b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/basic/test.ts new file mode 100644 index 000000000000..a3de589677ea --- /dev/null +++ b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/basic/test.ts @@ -0,0 +1,47 @@ +import { expect } from '@playwright/test'; + +import { sentryTest } from '../../../../../utils/fixtures'; + +import { envelopeRequestParser, shouldSkipFeatureFlagsTest, waitForErrorRequest } from '../../../../../utils/helpers'; + +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 }) => { + 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 = (window as any).initialize(); + for (let i = 1; i <= bufferSize; i++) { + client.getBooleanValue(`feat${i}`, false); + } + client.getBooleanValue(`feat${bufferSize + 1}`, true); // eviction + client.getBooleanValue('feat3', true); // 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: true }); + expectedFlags.push({ flag: 'feat3', result: true }); + + expect(event.contexts?.flags?.values).toEqual(expectedFlags); +}); diff --git a/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/errorHook/init.js b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/errorHook/init.js new file mode 100644 index 000000000000..971e08755fe6 --- /dev/null +++ b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/errorHook/init.js @@ -0,0 +1,20 @@ +import * as Sentry from '@sentry/browser'; + +window.Sentry = Sentry; +window.sentryOpenFeatureIntegration = Sentry.openFeatureIntegration(); + +Sentry.init({ + dsn: 'https://public@dsn.ingest.sentry.io/1337', + sampleRate: 1.0, + integrations: [window.sentryOpenFeatureIntegration], +}); + +window.initialize = () => { + return { + getBooleanValue(flag, value) { + let hook = new Sentry.OpenFeatureIntegrationHook(); + hook.error({ flagKey: flag, defaultValue: false }, new Error('flag eval error')); + return value; + }, + }; +}; diff --git a/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/errorHook/test.ts b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/errorHook/test.ts new file mode 100644 index 000000000000..719782d0b0ab --- /dev/null +++ b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/errorHook/test.ts @@ -0,0 +1,49 @@ +import { expect } from '@playwright/test'; + +import { sentryTest } from '../../../../../utils/fixtures'; + +import { envelopeRequestParser, shouldSkipFeatureFlagsTest, waitForErrorRequest } from '../../../../../utils/helpers'; + +const FLAG_BUFFER_SIZE = 100; // Corresponds to constant in featureFlags.ts, in browser utils. + +sentryTest('Flag evaluation error hook', 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 = (window as any).initialize(); + for (let i = 1; i <= bufferSize; i++) { + client.getBooleanValue(`feat${i}`, false); + } + client.getBooleanValue(`feat${bufferSize + 1}`, true); // eviction + client.getBooleanValue('feat3', true); // update + }, FLAG_BUFFER_SIZE); + + const reqPromise = waitForErrorRequest(page); + await page.locator('#error').click(); + const req = await reqPromise; + const event = envelopeRequestParser(req); + + // Default value is mocked as false -- these will all error and use default + // value + 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); +}); diff --git a/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/init.js b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/init.js new file mode 100644 index 000000000000..b2b48519b8a9 --- /dev/null +++ b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/init.js @@ -0,0 +1,20 @@ +import * as Sentry from '@sentry/browser'; + +window.Sentry = Sentry; +window.sentryOpenFeatureIntegration = Sentry.openFeatureIntegration(); + +Sentry.init({ + dsn: 'https://public@dsn.ingest.sentry.io/1337', + sampleRate: 1.0, + integrations: [window.sentryOpenFeatureIntegration], +}); + +window.initialize = () => { + return { + getBooleanValue(flag, value) { + let hook = new Sentry.OpenFeatureIntegrationHook(); + hook.after(null, { flagKey: flag, value: value }); + return value; + }, + }; +}; diff --git a/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/subject.js b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/subject.js new file mode 100644 index 000000000000..e6697408128c --- /dev/null +++ b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/subject.js @@ -0,0 +1,3 @@ +document.getElementById('error').addEventListener('click', () => { + throw new Error('Button triggered error'); +}); diff --git a/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/template.html b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/template.html new file mode 100644 index 000000000000..9330c6c679f4 --- /dev/null +++ b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/template.html @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/withScope/test.ts b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/withScope/test.ts new file mode 100644 index 000000000000..8abb68559b6d --- /dev/null +++ b/dev-packages/browser-integration-tests/suites/integrations/featureFlags/openfeature/withScope/test.ts @@ -0,0 +1,65 @@ +import { expect } from '@playwright/test'; + +import { sentryTest } from '../../../../../utils/fixtures'; + +import { envelopeRequestParser, shouldSkipFeatureFlagsTest, waitForErrorRequest } from '../../../../../utils/helpers'; + +import type { Scope } from '@sentry/browser'; + +sentryTest('Flag evaluations in forked scopes are stored separately.', 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); + + const forkedReqPromise = waitForErrorRequest(page, event => !!event.tags && event.tags.isForked === true); + const mainReqPromise = waitForErrorRequest(page, event => !!event.tags && event.tags.isForked === false); + + await page.waitForFunction(() => { + const Sentry = (window as any).Sentry; + const errorButton = document.querySelector('#error') as HTMLButtonElement; + const client = (window as any).initialize(); + + client.getBooleanValue('shared', true); + + Sentry.withScope((scope: Scope) => { + client.getBooleanValue('forked', true); + client.getBooleanValue('shared', false); + scope.setTag('isForked', true); + if (errorButton) { + errorButton.click(); + } + }); + + client.getBooleanValue('main', true); + Sentry.getCurrentScope().setTag('isForked', false); + errorButton.click(); + return true; + }); + + const forkedReq = await forkedReqPromise; + const forkedEvent = envelopeRequestParser(forkedReq); + + const mainReq = await mainReqPromise; + const mainEvent = envelopeRequestParser(mainReq); + + expect(forkedEvent.contexts?.flags?.values).toEqual([ + { flag: 'forked', result: true }, + { flag: 'shared', result: false }, + ]); + + expect(mainEvent.contexts?.flags?.values).toEqual([ + { flag: 'shared', result: true }, + { flag: 'main', result: true }, + ]); +}); diff --git a/packages/browser/src/index.ts b/packages/browser/src/index.ts index 5f762c2cfa9b..850bd71b78a0 100644 --- a/packages/browser/src/index.ts +++ b/packages/browser/src/index.ts @@ -15,10 +15,7 @@ export { captureFeedback, } from '@sentry/core'; -export { - replayIntegration, - getReplay, -} from '@sentry-internal/replay'; +export { replayIntegration, getReplay } from '@sentry-internal/replay'; export type { ReplayEventType, ReplayEventWithTime, @@ -36,17 +33,11 @@ export { replayCanvasIntegration } from '@sentry-internal/replay-canvas'; import { feedbackAsyncIntegration } from './feedbackAsync'; import { feedbackSyncIntegration } from './feedbackSync'; export { feedbackAsyncIntegration, feedbackSyncIntegration, feedbackSyncIntegration as feedbackIntegration }; -export { - getFeedback, - sendFeedback, -} from '@sentry-internal/feedback'; +export { getFeedback, sendFeedback } from '@sentry-internal/feedback'; export * from './metrics'; -export { - defaultRequestInstrumentationOptions, - instrumentOutgoingRequests, -} from './tracing/request'; +export { defaultRequestInstrumentationOptions, instrumentOutgoingRequests } from './tracing/request'; export { browserTracingIntegration, startBrowserTracingNavigationSpan, @@ -77,4 +68,6 @@ export type { Span } from '@sentry/types'; export { makeBrowserOfflineTransport } from './transports/offline'; export { browserProfilingIntegration } from './profiling/integration'; export { spotlightBrowserIntegration } from './integrations/spotlight'; +export { copyFlagsFromScopeToEvent, insertFlagToScope } from './utils/featureFlags'; export { launchDarklyIntegration, buildLaunchDarklyFlagUsedHandler } from './integrations/featureFlags/launchdarkly'; +export { openFeatureIntegration, OpenFeatureIntegrationHook } from './integrations/featureFlags/openfeature'; diff --git a/packages/browser/src/integrations/featureFlags/launchdarkly/integration.ts b/packages/browser/src/integrations/featureFlags/launchdarkly/integration.ts index 3d5b491ed889..0fc6f1085db7 100644 --- a/packages/browser/src/integrations/featureFlags/launchdarkly/integration.ts +++ b/packages/browser/src/integrations/featureFlags/launchdarkly/integration.ts @@ -1,8 +1,8 @@ import type { Client, Event, EventHint, IntegrationFn } from '@sentry/types'; import type { LDContext, LDEvaluationDetail, LDInspectionFlagUsedHandler } from './types'; -import { defineIntegration, getCurrentScope } from '@sentry/core'; -import { insertToFlagBuffer } from '../../../utils/featureFlags'; +import { defineIntegration } from '@sentry/core'; +import { copyFlagsFromScopeToEvent, insertFlagToScope } from '../../../utils/featureFlags'; /** * Sentry integration for capturing feature flags from LaunchDarkly. @@ -24,15 +24,7 @@ export const launchDarklyIntegration = defineIntegration(() => { name: 'LaunchDarkly', processEvent(event: Event, _hint: EventHint, _client: Client): Event { - const scope = getCurrentScope(); - const flagContext = scope.getScopeData().contexts.flags; - const flagBuffer = flagContext ? flagContext.values : []; - - if (event.contexts === undefined) { - event.contexts = {}; - } - event.contexts.flags = { values: [...flagBuffer] }; - return event; + return copyFlagsFromScopeToEvent(event); }, }; }) satisfies IntegrationFn; @@ -54,15 +46,7 @@ export function buildLaunchDarklyFlagUsedHandler(): LDInspectionFlagUsedHandler * Handle a flag evaluation by storing its name and value on the current scope. */ method: (flagKey: string, flagDetail: LDEvaluationDetail, _context: LDContext) => { - if (typeof flagDetail.value === 'boolean') { - const scopeContexts = getCurrentScope().getScopeData().contexts; - if (!scopeContexts.flags) { - scopeContexts.flags = { values: [] }; - } - const flagBuffer = scopeContexts.flags.values; - insertToFlagBuffer(flagBuffer, flagKey, flagDetail.value); - } - return; + insertFlagToScope(flagKey, flagDetail.value); }, }; } diff --git a/packages/browser/src/integrations/featureFlags/openfeature/index.ts b/packages/browser/src/integrations/featureFlags/openfeature/index.ts new file mode 100644 index 000000000000..e3d425aeac29 --- /dev/null +++ b/packages/browser/src/integrations/featureFlags/openfeature/index.ts @@ -0,0 +1 @@ +export { openFeatureIntegration, OpenFeatureIntegrationHook } from './integration'; diff --git a/packages/browser/src/integrations/featureFlags/openfeature/integration.ts b/packages/browser/src/integrations/featureFlags/openfeature/integration.ts new file mode 100644 index 000000000000..2fea43f4acfc --- /dev/null +++ b/packages/browser/src/integrations/featureFlags/openfeature/integration.ts @@ -0,0 +1,41 @@ +/** + * OpenFeature integration. + * + * Add the openFeatureIntegration() function call to your integration lists. + * Add the integration hook to your OpenFeature object. + * - OpenFeature.getClient().addHooks(new OpenFeatureIntegrationHook()); + */ +import type { Client, Event, EventHint, IntegrationFn } from '@sentry/types'; +import type { EvaluationDetails, HookContext, HookHints, JsonValue, OpenFeatureHook } from './types'; + +import { defineIntegration } from '@sentry/core'; +import { copyFlagsFromScopeToEvent, insertFlagToScope } from '../../../utils/featureFlags'; + +export const openFeatureIntegration = defineIntegration(() => { + return { + name: 'OpenFeature', + + processEvent(event: Event, _hint: EventHint, _client: Client): Event { + return copyFlagsFromScopeToEvent(event); + }, + }; +}) satisfies IntegrationFn; + +/** + * OpenFeature Hook class implementation. + */ +export class OpenFeatureIntegrationHook implements OpenFeatureHook { + /** + * Successful evaluation result. + */ + public after(_hookContext: Readonly>, evaluationDetails: EvaluationDetails): void { + insertFlagToScope(evaluationDetails.flagKey, evaluationDetails.value); + } + + /** + * On error evaluation result. + */ + public error(hookContext: Readonly>, _error: unknown, _hookHints?: HookHints): void { + insertFlagToScope(hookContext.flagKey, hookContext.defaultValue); + } +} diff --git a/packages/browser/src/integrations/featureFlags/openfeature/types.ts b/packages/browser/src/integrations/featureFlags/openfeature/types.ts new file mode 100644 index 000000000000..835e684d86eb --- /dev/null +++ b/packages/browser/src/integrations/featureFlags/openfeature/types.ts @@ -0,0 +1,89 @@ +export type FlagValue = boolean | string | number | JsonValue; +export type FlagValueType = 'boolean' | 'string' | 'number' | 'object'; +export type JsonArray = JsonValue[]; +export type JsonObject = { [key: string]: JsonValue }; +export type JsonValue = PrimitiveValue | JsonObject | JsonArray; +export type Metadata = Record; +export type PrimitiveValue = null | boolean | string | number; +export type FlagMetadata = Record; +export const StandardResolutionReasons = { + STATIC: 'STATIC', + DEFAULT: 'DEFAULT', + TARGETING_MATCH: 'TARGETING_MATCH', + SPLIT: 'SPLIT', + CACHED: 'CACHED', + DISABLED: 'DISABLED', + UNKNOWN: 'UNKNOWN', + STALE: 'STALE', + ERROR: 'ERROR', +} as const; +export enum ErrorCode { + PROVIDER_NOT_READY = 'PROVIDER_NOT_READY', + PROVIDER_FATAL = 'PROVIDER_FATAL', + FLAG_NOT_FOUND = 'FLAG_NOT_FOUND', + PARSE_ERROR = 'PARSE_ERROR', + TYPE_MISMATCH = 'TYPE_MISMATCH', + TARGETING_KEY_MISSING = 'TARGETING_KEY_MISSING', + INVALID_CONTEXT = 'INVALID_CONTEXT', + GENERAL = 'GENERAL', +} +export interface Logger { + error(...args: unknown[]): void; + warn(...args: unknown[]): void; + info(...args: unknown[]): void; + debug(...args: unknown[]): void; +} +export type ResolutionReason = keyof typeof StandardResolutionReasons | (string & Record); +export type EvaluationContextValue = + | PrimitiveValue + | Date + | { [key: string]: EvaluationContextValue } + | EvaluationContextValue[]; +export type EvaluationContext = { + targetingKey?: string; +} & Record; +export interface ProviderMetadata extends Readonly { + readonly name: string; +} +export interface ClientMetadata { + readonly name?: string; + readonly domain?: string; + readonly version?: string; + readonly providerMetadata: ProviderMetadata; +} +export type HookHints = Readonly>; +export interface HookContext { + readonly flagKey: string; + readonly defaultValue: T; + readonly flagValueType: FlagValueType; + readonly context: Readonly; + readonly clientMetadata: ClientMetadata; + readonly providerMetadata: ProviderMetadata; + readonly logger: Logger; +} +export interface BeforeHookContext extends HookContext { + context: EvaluationContext; +} +export type ResolutionDetails = { + value: U; + variant?: string; + flagMetadata?: FlagMetadata; + reason?: ResolutionReason; + errorCode?: ErrorCode; + errorMessage?: string; +}; +export type EvaluationDetails = { + flagKey: string; + flagMetadata: Readonly; +} & ResolutionDetails; +export interface BaseHook { + before?(hookContext: BeforeHookContext, hookHints?: HookHints): BeforeHookReturn; + after?( + hookContext: Readonly>, + evaluationDetails: EvaluationDetails, + hookHints?: HookHints, + ): HooksReturn; + error?(hookContext: Readonly>, error: unknown, hookHints?: HookHints): HooksReturn; + finally?(hookContext: Readonly>, hookHints?: HookHints): HooksReturn; +} +export type OpenFeatureHook = BaseHook; diff --git a/packages/browser/src/utils/featureFlags.ts b/packages/browser/src/utils/featureFlags.ts index caddd68bc31e..b2090c2783b8 100644 --- a/packages/browser/src/utils/featureFlags.ts +++ b/packages/browser/src/utils/featureFlags.ts @@ -1,5 +1,5 @@ -import { logger } from '@sentry/core'; -import type { FeatureFlag } from '@sentry/types'; +import { getCurrentScope, logger } from '@sentry/core'; +import type { Event, FeatureFlag } from '@sentry/types'; import { DEBUG_BUILD } from '../debug-build'; /** @@ -14,25 +14,56 @@ import { DEBUG_BUILD } from '../debug-build'; export const FLAG_BUFFER_SIZE = 100; /** - * Insert into a FeatureFlag array while maintaining ordered LRU properties. Not - * thread-safe. After inserting: + * Copies feature flags that are in current scope context to the event context + */ +export function copyFlagsFromScopeToEvent(event: Event): Event { + const scope = getCurrentScope(); + const flagContext = scope.getScopeData().contexts.flags; + const flagBuffer = flagContext ? flagContext.values : []; + + if (!flagBuffer.length) { + return event; + } + + if (event.contexts === undefined) { + event.contexts = {}; + } + event.contexts.flags = { values: [...flagBuffer] }; + return event; +} + +/** + * Creates a feature flags values array in current context if it does not exist + * and inserts the flag into a FeatureFlag array while maintaining ordered LRU + * properties. Not thread-safe. After inserting: * - `flags` is sorted in order of recency, with the newest flag at the end. * - No other flags with the same name exist in `flags`. * - The length of `flags` does not exceed `maxSize`. The oldest flag is evicted * as needed. * - * @param flags The array to insert into. * @param name Name of the feature flag to insert. * @param value Value of the feature flag. * @param maxSize Max number of flags the buffer should store. It's recommended - * to keep this consistent across insertions. Default is DEFAULT_MAX_SIZE + * to keep this consistent across insertions. Default is FLAG_BUFFER_SIZE */ -export function insertToFlagBuffer( - flags: FeatureFlag[], - name: string, - value: boolean, - maxSize: number = FLAG_BUFFER_SIZE, -): void { +export function insertFlagToScope(name: string, value: unknown, maxSize: number = FLAG_BUFFER_SIZE): void { + const scopeContexts = getCurrentScope().getScopeData().contexts; + if (!scopeContexts.flags) { + scopeContexts.flags = { values: [] }; + } + const flags = scopeContexts.flags.values as FeatureFlag[]; + insertToFlagBuffer(flags, name, value, maxSize); +} + +/** + * Exported for tests + */ +export function insertToFlagBuffer(flags: FeatureFlag[], name: string, value: unknown, maxSize: number): void { + // Currently only accepts boolean values + if (typeof value !== 'boolean') { + return; + } + if (flags.length > maxSize) { DEBUG_BUILD && logger.error(`[Feature Flags] insertToFlagBuffer called on a buffer larger than maxSize=${maxSize}`); return; diff --git a/packages/browser/test/utils/featureFlags.test.ts b/packages/browser/test/utils/featureFlags.test.ts index ef4ca7f4611f..d8ba469fc61a 100644 --- a/packages/browser/test/utils/featureFlags.test.ts +++ b/packages/browser/test/utils/featureFlags.test.ts @@ -1,9 +1,27 @@ +import { getCurrentScope } from '@sentry/core'; import type { FeatureFlag } from '@sentry/types'; import { logger } from '@sentry/utils'; import { vi } from 'vitest'; -import { insertToFlagBuffer } from '../../src/utils/featureFlags'; +import { insertFlagToScope, insertToFlagBuffer } from '../../src/utils/featureFlags'; describe('flags', () => { + describe('insertFlagToScope()', () => { + it('adds flags to the current scope context', () => { + const maxSize = 3; + insertFlagToScope('feat1', true, maxSize); + insertFlagToScope('feat2', true, maxSize); + insertFlagToScope('feat3', true, maxSize); + insertFlagToScope('feat4', true, maxSize); + + const scope = getCurrentScope(); + expect(scope.getScopeData().contexts.flags?.values).toEqual([ + { flag: 'feat2', result: true }, + { flag: 'feat3', result: true }, + { flag: 'feat4', result: true }, + ]); + }); + }); + describe('insertToFlagBuffer()', () => { const loggerSpy = vi.spyOn(logger, 'error'); @@ -54,6 +72,15 @@ describe('flags', () => { ]); }); + it('does not accept non-boolean values', () => { + const buffer: FeatureFlag[] = []; + const maxSize = 1000; + insertToFlagBuffer(buffer, 'feat1', 1, maxSize); + insertToFlagBuffer(buffer, 'feat2', 'string', maxSize); + + expect(buffer).toEqual([]); + }); + it('logs error and is a no-op when buffer is larger than maxSize', () => { const buffer: FeatureFlag[] = [ { flag: 'feat1', result: true },