Merge pull request #248 from Flagsmith/fix/race-condition-on-init-response

fix: race condition within flagsmith.init responses

Author: kyle-ssg

flagsmith-core.ts

@@ -86,8 +86,9 @@ const Flagsmith = class {
                 isFetching: true
             })
         }
+        const previousIdentity = `${this.identity}`;
         const handleResponse = (response: IFlagsmithResponse | null) => {
-            if(!response) {
+            if(!response || previousIdentity !== `${this.identity}`) {
                 return // getJSON returned null due to request/response mismatch
             }
             let { flags: features, traits }: IFlagsmithResponse = response

lib/flagsmith-es/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flagsmith-es",
-  "version": "4.1.1",
+  "version": "4.1.2",
   "description": "Feature flagging to support continuous development. This is an esm equivalent of the standard flagsmith npm module.",
   "main": "./index.js",
   "type": "module",

lib/flagsmith/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flagsmith",
-  "version": "4.1.1",
+  "version": "4.1.2",
   "description": "Feature flagging to support continuous development",
   "main": "./index.js",
   "repository": {

lib/react-native-flagsmith/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-flagsmith",
-  "version": "4.1.1",
+  "version": "4.1.2",
   "description": "Feature flagging to support continuous development",
   "main": "./index.js",
   "repository": {

test/react.test.tsx

@@ -1,7 +1,14 @@
 import React, { FC } from 'react';
 import { render, screen, waitFor } from '@testing-library/react';
 import { FlagsmithProvider, useFlags, useFlagsmithLoading } from '../lib/flagsmith/react';
-import { defaultState, environmentID, getFlagsmith, identityState, testIdentity } from './test-constants';
+import {
+    defaultState, delay,
+    environmentID,
+    getFlagsmith,
+    getMockFetchWithValue,
+    identityState,
+    testIdentity,
+} from './test-constants';
 import removeIds from './test-utils/remove-ids';
 const FlagsmithPage: FC<any> = () => {
     const flags = useFlags(Object.keys(defaultState.flags))
@@ -117,4 +124,41 @@ describe('FlagsmithProvider', () => {
             expect(JSON.parse(screen.getByTestId("flags").innerHTML)).toEqual(removeIds(defaultState.flags));
         });
     });
+    it('ignores init response if identify gets called and resolves first', async () => {
+
+        const onChange = jest.fn();
+        const {flagsmith,initConfig, mockFetch} = getFlagsmith({onChange})
+        getMockFetchWithValue(mockFetch, [{
+            enabled: false,
+            feature_state_value: null,
+            feature: {
+                id: 1,
+                name: "hero"
+            }
+        }],300) // resolves after flagsmith.identify, it should be ignored
+
+        render(
+            <FlagsmithProvider flagsmith={flagsmith} options={initConfig}>
+                <FlagsmithPage/>
+            </FlagsmithProvider>
+        );
+        expect(mockFetch).toHaveBeenCalledTimes(1);
+        getMockFetchWithValue(mockFetch, {
+            flags: [{
+                enabled: true,
+                feature_state_value: null,
+                feature: {
+                    id: 1,
+                    name: "hero"
+                }
+            }]
+        },0)
+        await flagsmith.identify(testIdentity)
+        expect(mockFetch).toHaveBeenCalledTimes(2);
+        await waitFor(() => {
+            expect(JSON.parse(screen.getByTestId("flags").innerHTML).hero.enabled).toBe(true)
+        });
+        await delay(500)
+        expect(JSON.parse(screen.getByTestId("flags").innerHTML).hero.enabled).toBe(true)
+    });
 });

test/test-constants.ts

@@ -2,6 +2,8 @@ import { IInitConfig, IState } from '../lib/flagsmith/types';
 import MockAsyncStorage from './mocks/async-storage-mock';
 import { createFlagsmithInstance } from '../lib/flagsmith';
 import fetch from 'isomorphic-unfetch';
+import type { ModuleMocker } from 'jest-mock';
+import Mock = jest.Mock;
 export const environmentID = 'QjgYur4LQTwe5HpvbvhpzK'; // Flagsmith Demo Projects
 
 export const defaultState = {
@@ -80,3 +82,11 @@ export function getFlagsmith(config: Partial<IInitConfig> = {}) {
     };
     return { flagsmith, initConfig, mockFetch, AsyncStorage };
 }
+export const delay = (ms:number) => new Promise((resolve) => setTimeout(resolve, ms));
+export function getMockFetchWithValue(mockFn:Mock, resolvedValue:object, ms=0) {
+    mockFn.mockReturnValueOnce(delay(ms).then(()=>Promise.resolve({
+        status:200,
+        text: () => Promise.resolve(JSON.stringify(resolvedValue)), // Mock json() to return the mock response
+        json: () => Promise.resolve(resolvedValue), // Mock json() to return the mock response
+    })))
+}