[BUG] ReactSDKClient setUser() is not working

[dtrenz]

Is there an existing issue for this?

• I have searched the existing issues

SDK Version

3.0.0

Current Behavior

When attempting to set the user ID on the Optimizely ReactSDK client using setUser() I see the following error when implementing a feature flag:

Unable to determine if feature "<feature key>" is enabled because User ID is not set

Expected Behavior

Setting a user ID using setUser() should set the usr ID on the client.

Steps To Reproduce

import { createInstance, OptimizelyProvider } from "@optimizely/react-sdk";
 
const App = () => {
  const optimizelyClient = createInstance({
    sdkKey: "<key>",
  });

  optimizelyClient.setUser({ id: "12345" });

  return (
    <OptimizelyProvider optimizely={optimizelyClient}>
      <Children />
    </OptimizelyProvider>
  );
}

...then, in a child component:

  const [isEnabled] = useFeature("<feature key>");

React Framework

React 18.2.0 (Create React App + react-app-rewired)

Browsers impacted

Reproducible in both Chrome and Safari. No other browsers were tested. The issue does not seem to be browser-specific.

Link

No response

Logs

Severity

No response

Workaround/Solution

I'm forced to abandon this approach and have to set the user ID via the user prop in <OptimizelyProvider>.

Recent Change

No

Conflicts

No response

[mikechu-optimizely]

Thanks for the report @dtrenz . Let me spin up a similar configuration as you've provided and try out. I'll work on #235 at the same time.

[mikechu-optimizely]

I've added an internal ticket FSSDK-9985 into our next sprint.

[ricky-harrys]

I'm seeing this issue as well, but I am setting the id in the <OptimizelyProvider/>. It's being evaluated before the SDK is ready but it should be available in <OptimizelyProvider /> at this point.

[danieleloscozzese]

I realise that the equivalent of a "+1" comment isn't necessarily helpful, but this bug has cost two separate colleagues of mine two different afternoons trying to debug configuration.
If the major has broken a principal interaction method, I would expect some update after 6 weeks.

We have exactly the same issue as reported by @ricky-harrys.

If the ticket opened is internal, a status update would be helpful, or an npm deprecate to warn on the install.

[mikechu-optimizely]

Thanks for hanging in there as we align fixes for both the React and underlying JS SDKs.

I've notified my manager that we need to look at both this and #235.

Sorry about the low update counts here to keep you all apprised. I will get updates and movement for you all shortly.

[mikechu-optimizely]

I'm moving a patch to the JS SDK out, then updating the dep along with fixes for this issue. I should have a release out early-mid next week.

[mikechu-optimizely]

We've released v3.1.0 of the React SDK.

When you have a moment, please let me know how this looks in a QA/Staging scenario.

[mikechu-optimizely]

I think this one should be solved.

I just noticed some modifications that I'd suggest in the provided example:

const optimizelyClient = createInstance({
  sdkKey: "<key>",
});

const App = () => {
  //optimizelyClient.setUser({ id: "12345" });

  return (
    <OptimizelyProvider optimizely={optimizelyClient} user={{ id: "12345" }}>
      <Children />
    </OptimizelyProvider>
  );
}

1. Let's move the user declaration into the OptimizelyProvider as a prop. If you'd like to set a user later, let's put it in a useEffect hook.
2. Also consider moving the optimizelyClient outside the App component. Check out the React Quickstart for an example.

[mikechu-optimizely]

Feel free to update here if needed.