@dynatrace/openfeature-provider-web

The official Dynatrace OpenFeature provider for web.

Questions, comments or suggestions? Reach out to [email protected].

Installation

npm install @dynatrace/openfeature-provider-web @openfeature/web-sdk

# yarn requires manual installation of the @openfeature/core peer-dependency
yarn add @dynatrace/openfeature-provider-web @openfeature/web-sdk @openfeature/core

Configuration

| Option | Type | Required | Default | Description | | -------------- | -------- | -------- | --------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | sdkKey | string | ✅ | — | Dynatrace SDK key (e.g. dt01.web_us_…). The region segment determines the OFREP endpoint; the full key is sent as the Authorization header. | | pollInterval | number | ❌ | -1 (disabled) | How often (ms) the provider polls for updated flags. Set to -1 or omit to rely solely on context-change refetches. The minimum polling interval that can be set is 1000ms. |

Usage

Basic setup

import { OpenFeature } from '@openfeature/web-sdk';
import { DynatraceProvider } from '@dynatrace/openfeature-provider-web';

const provider = new DynatraceProvider({
  sdkKey: 'dt01.web_us_…',
});

// Set evaluation context before registering the provider so the initial
// bulk evaluation includes targeting information.
await OpenFeature.setContext({ targetingKey: 'user-abc' });

// Wait until the provider has fetched all flags before evaluating.
await OpenFeature.setProviderAndWait(provider);

const client = OpenFeature.getClient();
const showBanner = client.getBooleanValue('show-banner', false);

Context changes

Calling OpenFeature.setContext() after provider registration automatically triggers a new bulk evaluation for the new context. Changed flag keys are surfaced via the PROVIDER_CONFIGURATION_CHANGED event.

// Re-evaluates all flags for the new user context.
await OpenFeature.setContext({ targetingKey: 'user-xyz', plan: 'enterprise' });

Periodic polling

Pass a pollInterval (in milliseconds) to have the provider re-fetch flags on a timer in addition to context-change triggers.

const provider = new DynatraceProvider({
  sdkKey: 'dt01.web_us_…',
  pollInterval: 60_000, // refresh every 60 seconds
});

Listening for flag changes

import { OpenFeature, ProviderEvents } from '@openfeature/web-sdk';

OpenFeature.addHandler(ProviderEvents.ConfigurationChanged, (event) => {
  console.log('Flags changed:', event?.flagsChanged);
  // Re-render components that depend on changed flags.
});

License

Apache-2.0