🪟 🔧 Allow inspecting active experiments on window (#6404)

airbyte-webapp/src/core/utils/debug.ts

@@ -0,0 +1,20 @@
+import { useEffect } from "react";
+
+/**
+ * Utility to make a value via a getter available on the window object for debugging.
+ */
+export const useDebugVariable = (name: string, getter: () => unknown): void => {
+  useEffect(() => {
+    Object.defineProperty(window, name, {
+      get: getter,
+      configurable: true,
+    });
+    return () => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      delete (window as any)[name];
+    };
+    // We don't want to reattach this if the getter changes, to make sure consumers
+    // of this don't need to useCallback the argument.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [name]);
+};

airbyte-webapp/src/packages/cloud/services/thirdParty/launchdarkly/LDExperimentService.tsx

@@ -9,6 +9,7 @@ import { LoadingPage } from "components";
 import { useConfig } from "config";
 import { useI18nContext } from "core/i18n";
 import { useAnalyticsService } from "core/services/analytics";
+import { useDebugVariable } from "core/utils/debug";
 import { useAppMonitoringService, AppActionCodes } from "hooks/services/AppMonitoringService";
 import { ExperimentProvider, ExperimentService } from "hooks/services/Experiment";
 import type { Experiments } from "hooks/services/Experiment/experiments";
@@ -131,6 +132,11 @@ const LDInitializationWrapper: React.FC<React.PropsWithChildren<{ apiKey: string
       });
   }
 
+  useDebugVariable("_EXPERIMENTS", () => ({
+    ...ldClient.current?.allFlags(),
+    ...((process.env.REACT_APP_EXPERIMENT_OVERWRITES as unknown as Record<string, unknown>) ?? {}),
+  }));
+
   useEffectOnce(() => {
     const onFeatureFlagsChanged = () => {
       // Update analytics context whenever a flag changes