fix(hooks): update useFeature decisions when forced variation updates

src/Feature.spec.tsx

@@ -53,6 +53,7 @@ describe('<OptimizelyFeature>', () => {
  attributes: {},
  },
  isReady: jest.fn().mockReturnValue(false),
+ onForcedVariationsUpdate: jest.fn().mockReturnValue(() => {}),
  } as unknown) as ReactSDKClient;
  });
  it('throws an error when not rendered in the context of an OptimizelyProvider', () => {

src/hooks.spec.tsx

@@ -666,6 +666,24 @@ describe('hooks', () => {
  component.update();
  expect(isFeatureEnabledMock).not.toHaveBeenCalled();
  });
+
+ it('should re-render after setForcedVariation is called on the client', async () => {
+ isFeatureEnabledMock.mockReturnValue(false);
+ const component = Enzyme.mount(
+ <OptimizelyProvider optimizely={optimizelyMock}>
+ <MyFeatureComponent options={{ autoUpdate: true }} />
+ </OptimizelyProvider>
+ );
+
+ component.update();
+ expect(component.text()).toBe('false|{"foo":"bar"}|true|false');
+
+ isFeatureEnabledMock.mockReturnValue(true);
+ forcedVariationUpdateCallbacks[0]();
+
+ component.update();
+ expect(component.text()).toBe('true|{"foo":"bar"}|true|false');
+ });
  });
 
  describe('useDecision', () => {

src/hooks.ts

@@ -319,6 +319,17 @@ export const useFeature: UseFeature = (featureKey, options = {}, overrides = {})
  return (): void => {};
  }, [isClientReady, options.autoUpdate, optimizely, featureKey, getCurrentDecision]);
 
+ useEffect(
+ () =>
+ optimizely.onForcedVariationsUpdate(() => {
+ setState(prevState => ({
+ ...prevState,
+ ...getCurrentDecision(),
+ }));
+ }),
+ [getCurrentDecision, optimizely]
+ );
+
  return [state.isEnabled, state.variables, state.clientReady, state.didTimeout];
 };