Skip to main content

OpenFeature Web Provider

OpenFeature is an open standard that provides a vendor-agnostic, community-driven API for feature flagging that works with DevCycle.

DevCycle provides a Javascript implementation of the OpenFeature Web Provider interface, if you prefer to use the OpenFeature APIs to interface with DevCycle.

Npm package version GitHub

AI-Powered Install​

MCP Install

Follow the MCP Getting Started guide to quickly set up the DevCycle MCP server and connect your AI tool.

  • Run this prompt: "Install DevCycle into this app"

📦 Install in Cursor

📦 Install in VS Code

claude mcp add --transport http devcycle https://mcp.devcycle.com/mcp
AI Prompt

Usage​

Installation​

Install the OpenFeature Web SDK and DevCycle Web Provider:

NPM​

npm install --save @devcycle/openfeature-web-provider

Yarn​

If using yarn you will need to install peer-dependencies:

yarn add @openfeature/web-sdk @openfeature/core @devcycle/openfeature-web-provider

Getting Started​

Initialize the DevCycleProvider and set it as the provider for OpenFeature, which will initialize the DevCycle JS Client SDK internally:

import DevCycleProvider from '@devcycle/openfeature-web-provider'
import { OpenFeature } from '@openfeature/web-sdk'

...

const user = { user_id: 'user_id' }

// Initialize the DevCycle Provider
const devcycleProvider = new DevCycleProvider('<DEVCYCLE_CLIENT_SDK_KEY>')
// Set the context before the provider is set to ensure the DevCycle SDK is initialized with a user context.
await OpenFeature.setContext(user)
// Set the DevCycleProvider for OpenFeature
await OpenFeature.setProviderAndWait(devcycleProvider)
// Get the OpenFeature client
const openFeatureClient = OpenFeature.getClient()

Use a Variable value by passing the Variable key and default value to one of the OpenFeature flag evaluation methods

// Retrieve a boolean flag from the OpenFeature client
const boolFlag = openFeatureClient.getBooleanValue('boolean-flag', false)

Tracking Events​

You can use the OpenFeature track method to track events which will be sent to DevCycle as custom events. Calling track will queue the event, which will be sent in batches to the DevCycle servers.

openFeatureClient.track('custom-event', {
  target: 'event-target',
  value: 100,
  metaDataField: 'value',
})

To track custom events with OpenFeature you are required to set the first argument as the event name. The event name will be used as the event's type in DevCycle, and you can optionally set a value / target / date as defined in the DevCycleEvent Typescript Schema. Any additional properties will be added to the event as metaData fields.

Passing DevCycleOptions to the DevCycleProvider​

Ensure that you pass any custom DevCycleOptions to the DevCycleProvider constructor

const user = { user_id: 'user_id' }

const options = { logger: dvcDefaultLogger({ level: 'debug' }) }
const devcycleProvider = new DevCycleProvider('<DEVCYCLE_CLIENT_SDK_KEY>', options)
await OpenFeature.setProviderAndWait(devcycleProvider)

Required TargetingKey​

For DevCycle SDK to work we require either a targetingKey or user_id to be set on the OpenFeature context. This is used to identify the user as the user_id for a DevCycleUser in DevCycle.

Context properties to DevCycleUser​

The provider will automatically translate known DevCycleUser properties from the OpenFeature context to the DevCycleUser object. DevCycleUser TypeScript Interface

For example all these context properties will be set on the DevCycleUser:

openFeatureClient.setContext({
  user_id: 'user_id',
  email: 'email@devcycle.com',
  name: 'name',
  language: 'en',
  country: 'CA',
  appVersion: '1.0.11',
  appBuild: 1000,
  customData: { custom: 'data' },
  privateCustomData: { private: 'data' },
})

Context properties that are not known DevCycleUser properties will be automatically added to the customData property of the DevCycleUser.

Context Limitations​

DevCycle only supports flat JSON Object properties used in the Context. Non-flat properties will be ignored.

For example obj will be ignored:

openFeatureClient.setContext({
  user_id: 'user_id',
  obj: { key: 'value' },
})

JSON Flag Limitations​

The OpenFeature spec for JSON flags allows for any type of valid JSON value to be set as the flag value.

For example the following are all valid default value types to use with OpenFeature:

// Invalid JSON values for the DevCycle SDK, will return defaults
openFeatureClient.getObjectValue('json-flag', ['arry'])
openFeatureClient.getObjectValue('json-flag', 610)
openFeatureClient.getObjectValue('json-flag', false)
openFeatureClient.getObjectValue('json-flag', 'string')
openFeatureClient.getObjectValue('json-flag', null)

However, these are not valid types for the DevCycle SDK, the DevCycle SDK only supports JSON Objects:

// Valid JSON Object as the default value, will be evaluated by the DevCycle SDK
openFeatureClient.getObjectValue('json-flag', { default: 'value' })