Current Value override doesn't work with Javascript SDK

[ryangall7]

I've added the Javascript SDK to our bundle with web pack. The dev tools can read the features and user attributes no problem, but overriding the Current Value in dev tools doesn't seem to change the feature value.

Javascript Setup:

import { GrowthBook } from "@growthbook/growthbook";

const gb = new GrowthBook({
  apiHost: "https://cdn.growthbook.io",
  clientKey: "******************",
  enableDevMode: true,
  subscribeToChanges: true,
  trackingCallback: (experiment, result) => {
    // TODO: Use your real analytics tracking system
    console.log("Viewed Experiment", {
      experimentId: experiment.key,
      variationId: result.key
    });
  }
});
window.gb = gb; // Expose for debugging

...

gb.setAttributes({
  id: cartToken,
  email: window?.userAttributes?.email,
  customerId: window?.userAttributes?.customerId,
  totalSpent: window?.userAttributes?.totalSpent,
  ordersCount: window?.userAttributes?.ordersCount,
  tags: window?.userAttributes?.tags,
  country: Shopify.country,
  locale: Shopify?.locale,
  currency: Shopify?.currency?.active,
  url: window.location.href,
  userAgent: navigator.userAgent,
  screenWidth: window.innerWidth,
  screenSize: screenSize,
  themeId: Shopify.theme.id,
  themeName: Shopify.theme.name,
  themeRole: Shopify.theme.role
});


//===========================
// setup growthbook
//===========================

export const setupGrowthbook = async function(){

    // Wait for features to be available
    await gb.loadFeatures();

    const value = gb.getFeatureValue("google-top-quality-store");
    console.log("google-top-quality-store", value);

}

Heres the devtools screen:

The feature never shows as a force feature value:

I've been digging through to code to try and find the method by which these are getting set. It seems theres something with messages sent to the window so I started logging any related to GB

window.addEventListener("message", function (event) {
  const data = event.data;
  if(data?.type?.startsWith("GB_")){
    console.log(data);
  }
});

but I only get one message:

{
	attributes: {id: '31295c7d037d94ba9af407aee0fb2eba', email: undefined, customerId: undefined, totalSpent: undefined, ordersCount: undefined, …}
	experiments: {}
	features: { 
		google-top-quality-store : {defaultValue: false, rules: Array(1)}
	}
	overrides: {},
	type: "GB_REFRESH"
}

which also appears to have no overrides.

[bttf]

Hi @ryangall7 Thanks for submitting. I'm unable to reproduce the issue on my local. We've updated the SDK a few times now - it's at 0.36.0 now. Have you tried latest and seen the same results?

[velialiev]

Same issue here. I think I've managed to find the problem. In my case this happened since devtools' forced features are loaded asynchronously and are not awaited by await gb.init(), so if you rely on awaiting init and doesn't set setRenderer you won't get updates from devtools

@bttf