Intermittent Flakiness in Feature Flags on Safari/MacOS

[ea244wmi]

We have noticed an inconsistent behavior with our feature flags, specifically on Safari/MacOS. The issue manifests as a discrepancy between the network tab and the useFlags report.

In some instances, despite the network tab clearly indicating that a feature flag is enabled, useFlags reports the flag as disabled. This inconsistency is not constant but occurs intermittently and appears to be more frequent on Safari/MacOS.

Logs related to this issue are attached below for further investigation.

 "flagsmith": "3.23.2",

                      <FlagsmithProvider
                        options={{
                          environmentID:
                            getEnvVariable('VITE_FLAGSMITH_ENV_KEY') ?? '',
                          enableLogs: true,
                        }}
                        flagsmith={flagsmith}
                      >

[Log] FLAGSMITH: – 1709737411190 – "ms" – "Initialising with properties" (2) (flagsmith.js, line 390)
{environmentID: "###", api: "https://edge.api.flagsmith.com/api/v1/", headers: undefined, onChange: function, cacheFlags: undefined, …}
t2 {_trigger: function, _triggerLoadingState: function, timestamp: null, isLoading: false, eventSource: null, …}
[Log] FLAGSMITH: – 0 – "ms" – "Get Flags" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 1 – "ms" – "Initialising with properties" (2) (flagsmith.js, line 390)
{environmentID: "###", api: "https://edge.api.flagsmith.com/api/v1/", headers: undefined, onChange: function, cacheFlags: undefined, …}
t2 {_trigger: function, _triggerLoadingState: function, timestamp: null, isLoading: true, eventSource: null, …}
[Log] FLAGSMITH: – 0 – "ms" – "Get Flags" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 2 – "ms" – "React - Initialising event listeners" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 2 – "ms" – "React - Initialising event listeners" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 109 – "ms" – "React - Initialising event listeners" (flagsmith.js, line 390)
[Log] COMPONENT {flag: false} (index.tsx, line 35)
[Log] FLAGSMITH: – 112 – "ms" – "React - Initialising event listeners" (flagsmith.js, line 390)
[Log] COMPONENT {flag: false} (index.tsx, line 35)
[Log] FLAGSMITH: – 349 – "ms" – "Fetch response: 200 GET0https://edge.api.flagsmith.com/api/v1/flags/" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 350 – "ms" – "Loading state changed" – {error: null, isFetching: false, isLoading: false, …} (flagsmith.js, line 390)
{error: null, isFetching: false, isLoading: false, source: "SERVER"}Object
[Log] FLAGSMITH: – 350 – "ms" – "trigger called" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 350 – "ms" – "React - trigger event received" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 350 – "ms" – "React - useFlags flags and traits have changed" (flagsmith.js, line 390, x2)
[Log] FLAGSMITH: – 350 – "ms" – "Fetch response: 200 GET0https://edge.api.flagsmith.com/api/v1/flags/" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 351 – "ms" – "trigger called" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 351 – "ms" – "React - trigger event received" (flagsmith.js, line 390)
[Log] FLAGSMITH: – 351 – "ms" – "React - useFlags flags and traits have changed" (flagsmith.js, line 390, x2)
[Log] COMPONENT {flag: false} (index.tsx, line 35)
[Log] COMPONENT {flag: false} (index.tsx, line 35)

In network tab I can see one request to flagsmith edge api. (https://edge.api.flagsmith.com/api/v1/flags/) After payload inspection I can clearly see that flag which we're interested in is enabled:

{
    "feature": {
        "id": 50575,
        "type": "STANDARD",
        "name": "sample-flag"
    },
    "feature_state_value": "",
    "enabled": true
}

It’s also worth noting that there is no segment overriding logic in place that could potentially cause this discrepancy.

[kyle-ssg]

Hi @ea244wmi would it be possible to get a minimal code example for this? I can't really see why safari could behave any differently here but I'm sure we'll solve it if we can get replication.

Also, could I just check you're using the latest Flagsmith? We have fixed a couple issues in the past with useFlags updating.

[kyle-ssg]

Closing for now, please re-open with any further information.