Upgrade JS SDK dependency, and update internal logic to use lastUpdate property from JS SDK clients

EmilianoSanchez · EmilianoSanchez · commit 2a449dd43ab8 · 2024-09-05T10:16:57.000-03:00
diff --git a/CHANGES.txt b/CHANGES.txt
@@ -1,3 +1,8 @@
+1.13.0 (September XX, 2024)
+ - Updated @splitsoftware/splitio package to version 10.28.0 that includes minor updates:
+      - Added `sync.requestOptions.getHeaderOverrides` configuration option to enhance SDK HTTP request Headers for Authorization Frameworks.
+      - Updated some transitive dependencies for vulnerability fixes.
+
 1.12.1 (August 2, 2024)
  - Updated @splitsoftware/splitio package to version 10.27.0 and some transitive dependencies for vulnerability fixes.
 
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -63,7 +63,7 @@
   },
   "homepage": "https://github.com/splitio/react-client#readme",
   "dependencies": {
-    "@splitsoftware/splitio": "10.27.0",
+    "@splitsoftware/splitio": "10.28.0-rc.3",
     "memoize-one": "^5.1.1",
     "shallowequal": "^1.1.0",
     "tslib": "^2.3.1"
diff --git a/src/SplitClient.tsx b/src/SplitClient.tsx
@@ -86,7 +86,7 @@ export class SplitComponent extends React.Component<IUpdateProps & { factory: Sp
   }
 
   update = () => {
-    this.setState({ lastUpdate: (this.state.client as IClientWithContext).lastUpdate });
+    this.setState({ lastUpdate: (this.state.client as IClientWithContext).__getStatus().lastUpdate });
   }
 
   componentDidMount() {
diff --git a/src/__tests__/SplitClient.test.tsx b/src/__tests__/SplitClient.test.tsx
@@ -15,6 +15,7 @@ import { SplitFactoryProvider } from '../SplitFactoryProvider';
 import { SplitClient } from '../SplitClient';
 import { SplitContext } from '../SplitContext';
 import { testAttributesBinding, TestComponentProps } from './testUtils/utils';
+import { IClientWithContext } from '../utils';
 
 describe('SplitClient', () => {
 
@@ -55,7 +56,7 @@ describe('SplitClient', () => {
             expect(hasTimedout).toBe(false);
             expect(isTimedout).toBe(false);
             expect(isDestroyed).toBe(false);
-            expect(lastUpdate).toBe(0);
+            expect(lastUpdate).toBe((outerFactory.client() as IClientWithContext).__getStatus().lastUpdate);
 
             return null;
           }}
@@ -212,7 +213,7 @@ describe('SplitClient', () => {
             count++;
 
             // side effect in the render phase
-            if (!(client as any).__getStatus().isReady) {
+            if (!(client as IClientWithContext).__getStatus().isReady) {
               console.log('emit');
               (client as any).__emitter__.emit(Event.SDK_READY);
             }
diff --git a/src/__tests__/SplitFactory.test.tsx b/src/__tests__/SplitFactory.test.tsx
@@ -15,7 +15,7 @@ import { ISplitFactoryChildProps } from '../types';
 import { SplitFactory } from '../SplitFactory';
 import { SplitClient } from '../SplitClient';
 import { SplitContext } from '../SplitContext';
-import { __factories } from '../utils';
+import { __factories, IClientWithContext } from '../utils';
 import { WARN_SF_CONFIG_AND_FACTORY, ERROR_SF_NO_CONFIG_AND_FACTORY } from '../constants';
 
 describe('SplitFactory', () => {
@@ -54,7 +54,7 @@ describe('SplitFactory', () => {
           expect(hasTimedout).toBe(false);
           expect(isTimedout).toBe(false);
           expect(isDestroyed).toBe(false);
-          expect(lastUpdate).toBe(0);
+          expect(lastUpdate).toBe((outerFactory.client() as IClientWithContext).__getStatus().lastUpdate);
           expect((factory as SplitIO.ISDK).settings.version).toBe(outerFactory.settings.version);
           return null;
         }}
diff --git a/src/__tests__/SplitFactoryProvider.test.tsx b/src/__tests__/SplitFactoryProvider.test.tsx
@@ -15,7 +15,7 @@ import { ISplitFactoryChildProps } from '../types';
 import { SplitFactoryProvider } from '../SplitFactoryProvider';
 import { SplitClient } from '../SplitClient';
 import { SplitContext } from '../SplitContext';
-import { __factories } from '../utils';
+import { __factories, IClientWithContext } from '../utils';
 import { WARN_SF_CONFIG_AND_FACTORY } from '../constants';
 
 describe('SplitFactoryProvider', () => {
@@ -54,7 +54,7 @@ describe('SplitFactoryProvider', () => {
           expect(hasTimedout).toBe(false);
           expect(isTimedout).toBe(false);
           expect(isDestroyed).toBe(false);
-          expect(lastUpdate).toBe(0);
+          expect(lastUpdate).toBe((outerFactory.client() as IClientWithContext).__getStatus().lastUpdate);
           expect((factory as SplitIO.ISDK).settings.version).toBe(outerFactory.settings.version);
           return null;
         }}
diff --git a/src/__tests__/SplitTreatments.test.tsx b/src/__tests__/SplitTreatments.test.tsx
@@ -8,7 +8,7 @@ jest.mock('@splitsoftware/splitio/client', () => {
 });
 import { SplitFactory as SplitSdk } from '@splitsoftware/splitio/client';
 import { sdkBrowser } from './testUtils/sdkConfigs';
-import { getStatus } from '../utils';
+import { getStatus, IClientWithContext } from '../utils';
 import { newSplitFactoryLocalhostInstance } from './testUtils/utils';
 import { CONTROL_WITH_CONFIG } from '../constants';
 
@@ -70,7 +70,7 @@ describe('SplitTreatments', () => {
                   expect(clientMock.getTreatmentsWithConfig.mock.calls.length).toBe(1);
                   expect(treatments).toBe(clientMock.getTreatmentsWithConfig.mock.results[0].value);
                   expect(featureFlagNames).toBe(clientMock.getTreatmentsWithConfig.mock.calls[0][0]);
-                  expect([isReady2, isReadyFromCache, hasTimedout, isTimedout, isDestroyed, lastUpdate]).toStrictEqual([true, false, false, false, false, 0]);
+                  expect([isReady2, isReadyFromCache, hasTimedout, isTimedout, isDestroyed, lastUpdate]).toStrictEqual([true, false, false, false, false, (outerFactory.client() as IClientWithContext).__getStatus().lastUpdate]);
                   return null;
                 }}
               </SplitTreatments>
diff --git a/src/__tests__/testUtils/mockSplitSdk.ts b/src/__tests__/testUtils/mockSplitSdk.ts
@@ -32,14 +32,22 @@ function buildInstanceId(key: any, trafficType: string | undefined) {
 
 function mockClient(_key: SplitIO.SplitKey, _trafficType?: string) {
   // Readiness
-  let __isReady__: boolean | undefined;
-  let __isReadyFromCache__: boolean | undefined;
-  let __hasTimedout__: boolean | undefined;
-  let __isDestroyed__: boolean | undefined;
+  let isReady = false;
+  let isReadyFromCache = false;
+  let hasTimedout = false;
+  let isDestroyed = false;
+  let lastUpdate = 0;
+
+  function syncLastUpdate() {
+    const dateNow = Date.now();
+    lastUpdate = dateNow > lastUpdate ? dateNow : lastUpdate + 1;
+  }
+
   const __emitter__ = new EventEmitter();
-  __emitter__.on(Event.SDK_READY, () => { __isReady__ = true; });
-  __emitter__.on(Event.SDK_READY_FROM_CACHE, () => { __isReadyFromCache__ = true; });
-  __emitter__.on(Event.SDK_READY_TIMED_OUT, () => { __hasTimedout__ = true; });
+  __emitter__.on(Event.SDK_READY, () => { isReady = true; syncLastUpdate(); });
+  __emitter__.on(Event.SDK_READY_FROM_CACHE, () => { isReadyFromCache = true; syncLastUpdate(); });
+  __emitter__.on(Event.SDK_READY_TIMED_OUT, () => { hasTimedout = true; syncLastUpdate(); });
+  __emitter__.on(Event.SDK_UPDATE, () => { syncLastUpdate(); });
 
   let attributesCache = {};
 
@@ -72,21 +80,23 @@ function mockClient(_key: SplitIO.SplitKey, _trafficType?: string) {
   });
   const ready: jest.Mock = jest.fn(() => {
     return new Promise<void>((res, rej) => {
-      if (__isReady__) res();
+      if (isReady) res();
       else { __emitter__.on(Event.SDK_READY, res); }
-      if (__hasTimedout__) rej();
+      if (hasTimedout) rej();
       else { __emitter__.on(Event.SDK_READY_TIMED_OUT, rej); }
     });
   });
   const __getStatus = () => ({
-    isReady: __isReady__ || false,
-    isReadyFromCache: __isReadyFromCache__ || false,
-    hasTimedout: __hasTimedout__ || false,
-    isDestroyed: __isDestroyed__ || false,
-    isOperational: ((__isReady__ || __isReadyFromCache__) && !__isDestroyed__) || false,
+    isReady,
+    isReadyFromCache,
+    hasTimedout,
+    isDestroyed,
+    isOperational: (isReady || isReadyFromCache) && !isDestroyed,
+    lastUpdate,
   });
   const destroy: jest.Mock = jest.fn(() => {
-    __isDestroyed__ = true;
+    isDestroyed = true;
+    syncLastUpdate();
     // __emitter__.removeAllListeners();
     return Promise.resolve();
   });
@@ -108,7 +118,8 @@ function mockClient(_key: SplitIO.SplitKey, _trafficType?: string) {
     // Restore the mock client to its initial NO-READY status.
     // Useful when you want to reuse the same mock between tests after emitting events or destroying the instance.
     __restore() {
-      __isReady__ = __isReadyFromCache__ = __hasTimedout__ = __isDestroyed__ = undefined;
+      isReady = isReadyFromCache = hasTimedout = isDestroyed = false;
+      lastUpdate = 0;
     }
   });
 }
diff --git a/src/useSplitClient.ts b/src/useSplitClient.ts
@@ -45,7 +45,7 @@ export function useSplitClient(options?: IUseSplitClientOptions): ISplitContextV
   React.useEffect(() => {
     if (!client) return;
 
-    const update = () => setLastUpdate(client.lastUpdate);
+    const update = () => setLastUpdate(client.__getStatus().lastUpdate);
 
     // Clients are created on the hook's call, so the status may have changed
     const statusOnEffect = getStatus(client);
diff --git a/src/utils.ts b/src/utils.ts
@@ -16,8 +16,8 @@ export interface IClientWithContext extends SplitIO.IBrowserClient {
     isOperational: boolean;
     hasTimedout: boolean;
     isDestroyed: boolean;
+    lastUpdate: number;
   };
-  lastUpdate: number;
 }
 
 /**
@@ -51,23 +51,9 @@ export function getSplitClient(factory: SplitIO.IBrowserSDK, key?: SplitIO.Split
   // factory.client is an idempotent operation
   const client = (key !== undefined ? factory.client(key, trafficType) : factory.client()) as IClientWithContext;
 
-  // Handle client lastUpdate
-  if (client.lastUpdate === undefined) {
-    // Remove EventEmitter warning emitted when using multiple SDK hooks or components.
-    // Unlike JS SDK, users can avoid using the client directly, making the warning irrelevant.
-    client.setMaxListeners(0);
-
-    const updateLastUpdate = () => {
-      const lastUpdate = Date.now();
-      client.lastUpdate = lastUpdate > client.lastUpdate ? lastUpdate : client.lastUpdate + 1;
-    }
-
-    client.lastUpdate = 0;
-    client.on(client.Event.SDK_READY, updateLastUpdate);
-    client.on(client.Event.SDK_READY_FROM_CACHE, updateLastUpdate);
-    client.on(client.Event.SDK_READY_TIMED_OUT, updateLastUpdate);
-    client.on(client.Event.SDK_UPDATE, updateLastUpdate);
-  }
+  // Remove EventEmitter warning emitted when using multiple SDK hooks or components.
+  // Unlike JS SDK, users don't need to access the client directly, making the warning irrelevant.
+  client.setMaxListeners(0);
 
   if ((factory as IFactoryWithClients).clientInstances) {
     (factory as IFactoryWithClients).clientInstances.add(client);
@@ -97,7 +83,7 @@ export function getStatus(client: SplitIO.IBrowserClient | null): ISplitStatus {
     isTimedout: hasTimedout && !isReady,
     hasTimedout,
     isDestroyed: status ? status.isDestroyed : false,
-    lastUpdate: client ? (client as IClientWithContext).lastUpdate || 0 : 0,
+    lastUpdate: status ? status.lastUpdate : 0,
   };
 }
 

Original file line number	Diff line number	Diff line change
`@@ -86,7 +86,7 @@ export class SplitComponent extends React.Component<IUpdateProps & { factory: Sp`
`86`	`86`	`}`
`87`	`87`
`88`	`88`	`update = () => {`
`89`		`- this.setState({ lastUpdate: (this.state.client as IClientWithContext).lastUpdate });`
	`89`	`+ this.setState({ lastUpdate: (this.state.client as IClientWithContext).__getStatus().lastUpdate });`
`90`	`90`	`}`
`91`	`91`
`92`	`92`	`componentDidMount() {`