Skip to content

Commit 6b3a4e3

Browse files
beeme1mrtoddbaert
andauthored
fix: add setProviderAndWait examples (#614)
## This PR - adds `setProviderAndWait` example on the server readme - adds `setProviderAndWait` example on the client readme - fixed invalid link on the server readme ### Related Issues Fixes #613 ### Notes The React SDK wasn't updated in this PR. Signed-off-by: Michael Beemer <[email protected]> --------- Signed-off-by: Michael Beemer <[email protected]> Signed-off-by: Todd Baert <[email protected]> Co-authored-by: Todd Baert <[email protected]>
1 parent cb7d2be commit 6b3a4e3

File tree

2 files changed

+44
-24
lines changed

2 files changed

+44
-24
lines changed

packages/client/README.md

+21-20
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ yarn add @openfeature/web-sdk @openfeature/core
7070
import { OpenFeature } from '@openfeature/web-sdk';
7171

7272
// Register your feature flag provider
73-
OpenFeature.setProvider(new YourProviderOfChoice());
73+
await OpenFeature.setProviderAndWait(new YourProviderOfChoice());
7474

7575
// create a new client
7676
const client = OpenFeature.getClient();
@@ -110,10 +110,24 @@ If the provider you're looking for hasn't been created yet, see the [develop a p
110110

111111
Once you've added a provider as a dependency, it can be registered with OpenFeature like this:
112112

113+
#### Awaitable
114+
115+
To register a provider and ensure it is ready before further actions are taken, you can use the `setProviderAndWait` method as shown below:
116+
117+
```ts
118+
await OpenFeature.setProviderAndWait(new MyProvider());
119+
```
120+
121+
#### Synchronous
122+
123+
To register a provider in a synchronous manner, you can use the `setProvider` method as shown below:
124+
113125
```ts
114-
OpenFeature.setProvider(new MyProvider())
126+
OpenFeature.setProvider(new MyProvider());
115127
```
116128

129+
Once the provider has been registered, the status can be tracked using [events](#eventing).
130+
117131
In some situations, it may be beneficial to register multiple providers in the same application.
118132
This is possible using [named clients](#named-clients), which is covered in more detail below.
119133

@@ -131,22 +145,7 @@ sequenceDiagram
131145
In (1) the Client sends a request to the provider backend in order to get all values from all feature flags that it has.
132146
Once the provider backend replies (2) the client holds all flag values and therefore the flag evaluation process is synchronous.
133147

134-
In order to prevent flag evaluation to the default value while flags are still being fetched, it is highly recommended to only look for flag value after the provider has emitted the `Ready` event.
135-
The following code snippet provides an example.
136-
137-
```ts
138-
import { OpenFeature, ProviderEvents } from '@openfeature/web-sdk';
139-
140-
OpenFeature.setProvider( /*set a provider*/ );
141-
142-
// OpenFeature API
143-
OpenFeature.addHandler(ProviderEvents.Ready, () => {
144-
const client = OpenFeature.getClient();
145-
const stringFlag = client.getStringValue('string-flag', "default value"))
146-
147-
//use stringFlag from this point
148-
});
149-
```
148+
In order to prevent flag evaluations from defaulting while the provider is initializing, it is highly recommended to evaluate flags only after the provider is ready. This can be done using the `setProviderAndWait` method or using the `setProvider` method and listening for the `READY` [event](#eventing).
150149

151150
### Targeting and Context
152151

@@ -238,13 +237,13 @@ import { OpenFeature, ProviderEvents } from '@openfeature/web-sdk';
238237

239238
// OpenFeature API
240239
OpenFeature.addHandler(ProviderEvents.Ready, (eventDetails) => {
241-
console.log(`Ready event from: ${eventDetails?.clientName}:`, eventDetails);
240+
console.log(`Ready event from: ${eventDetails?.providerName}:`, eventDetails);
242241
});
243242

244243
// Specific client
245244
const client = OpenFeature.getClient();
246245
client.addHandler(ProviderEvents.Error, (eventDetails) => {
247-
console.log(`Error event from: ${eventDetails?.clientName}:`, eventDetails);
246+
console.log(`Error event from: ${eventDetails?.providerName}:`, eventDetails);
248247
});
249248
```
250249

@@ -272,6 +271,8 @@ import { JsonValue, Provider, ResolutionDetails } from '@openfeature/web-sdk';
272271

273272
// implement the provider interface
274273
class MyProvider implements Provider {
274+
// Adds runtime validation that the provider is used with the expected SDK
275+
public readonly runsOn = 'client';
275276

276277
readonly metadata = {
277278
name: 'My Provider',

packages/server/README.md

+23-4
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ yarn add @openfeature/server-sdk @openfeature/core
6767
import { OpenFeature } from '@openfeature/server-sdk';
6868

6969
// Register your feature flag provider
70-
OpenFeature.setProvider(new YourProviderOfChoice());
70+
await OpenFeature.setProviderAndWait(new YourProviderOfChoice());
7171

7272
// create a new client
7373
const client = OpenFeature.getClient();
@@ -107,10 +107,24 @@ If the provider you're looking for hasn't been created yet, see the [develop a p
107107

108108
Once you've added a provider as a dependency, it can be registered with OpenFeature like this:
109109

110+
#### Awaitable
111+
112+
To register a provider and ensure it is ready before further actions are taken, you can use the `setProviderAndWait` method as shown below:
113+
114+
```ts
115+
await OpenFeature.setProviderAndWait(new MyProvider());
116+
```
117+
118+
#### Synchronous
119+
120+
To register a provider in a synchronous manner, you can use the `setProvider` method as shown below:
121+
110122
```ts
111-
OpenFeature.setProvider(new MyProvider())
123+
OpenFeature.setProvider(new MyProvider());
112124
```
113125

126+
Once the provider has been registered, the status can be tracked using [events](#eventing).
127+
114128
In some situations, it may be beneficial to register multiple providers in the same application.
115129
This is possible using [named clients](#named-clients), which is covered in more details below.
116130

@@ -211,6 +225,9 @@ const clientWithDefault = OpenFeature.getClient();
211225
const clientForCache = OpenFeature.getClient("otherClient");
212226
```
213227

228+
Named providers can be set in an awaitable or synchronous way.
229+
For more details, please refer to the [providers](#providers) section.
230+
214231
### Eventing
215232

216233
Events allow you to react to state changes in the provider or underlying flag management system, such as flag definition changes, provider readiness, or error conditions.
@@ -224,13 +241,13 @@ import { OpenFeature, ProviderEvents } from '@openfeature/server-sdk';
224241

225242
// OpenFeature API
226243
OpenFeature.addHandler(ProviderEvents.Ready, (eventDetails) => {
227-
console.log(`Ready event from: ${eventDetails?.clientName}:`, eventDetails);
244+
console.log(`Ready event from: ${eventDetails?.providerName}:`, eventDetails);
228245
});
229246

230247
// Specific client
231248
const client = OpenFeature.getClient();
232249
client.addHandler(ProviderEvents.Error, (eventDetails) => {
233-
console.log(`Error event from: ${eventDetails?.clientName}:`, eventDetails);
250+
console.log(`Error event from: ${eventDetails?.providerName}:`, eventDetails);
234251
});
235252
```
236253

@@ -258,6 +275,8 @@ import { JsonValue, Provider, ResolutionDetails } from '@openfeature/server-sdk'
258275

259276
// implement the provider interface
260277
class MyProvider implements Provider {
278+
// Adds runtime validation that the provider is used with the expected SDK
279+
public readonly runsOn = 'server';
261280

262281
readonly metadata = {
263282
name: 'My Provider',

0 commit comments

Comments
 (0)