@envive-ai/react-hooks 0.3.45 → 0.3.47

package/src/hooks/ProductDetails/useProductDetails.ts

@@ -0,0 +1,62 @@
+import { useEffect, useState } from 'react';
+import CommerceApiClient from 'src/application/commerce-api';
+import { ProductDetails } from 'src/application/models/graphql/queries/getProductOptionsQuery';
+
+export type {
+  ProductDetails,
+  ProductOption,
+  ProductVariant,
+  ProductVariantOption,
+} from 'src/application/models/graphql/queries/getProductOptionsQuery';
+
+export interface UseProductDetailsResult {
+  data: ProductDetails | undefined;
+  isLoading: boolean;
+  error: Error | undefined;
+}
+
+/**
+ * Fetches variant-level product details (options, availability, pricing, images)
+ * for the given product ID via CommerceApiClient.retrieveProductDetails (GraphQL
+ * `me.productOptions`). Only meaningful for products that offer variations.
+ *
+ * Returns an idle result ({ data: undefined, isLoading: false, error: undefined })
+ * when productId is not provided.
+ */
+export const useProductDetails = (productId: string | undefined): UseProductDetailsResult => {
+  const [data, setData] = useState<ProductDetails | undefined>(undefined);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | undefined>(undefined);
+
+  useEffect(() => {
+    if (!productId) {
+      setData(undefined);
+      setIsLoading(false);
+      setError(undefined);
+      return undefined;
+    }
+    let cancelled = false;
+    setData(undefined);
+    setError(undefined);
+    setIsLoading(true);
+    CommerceApiClient.retrieveProductDetails(productId).then(
+      result => {
+        if (!cancelled) {
+          setData(result);
+          setIsLoading(false);
+        }
+      },
+      err => {
+        if (!cancelled) {
+          setError(err instanceof Error ? err : new Error(String(err)));
+          setIsLoading(false);
+        }
+      },
+    );
+    return () => {
+      cancelled = true;
+    };
+  }, [productId]);
+
+  return { data, isLoading, error };
+};

package/src/hooks/ProductDetails/variantSelection.ts

@@ -0,0 +1,61 @@
+import CommerceApiClient from 'src/application/commerce-api';
+import {
+  ProductDetails,
+  ProductVariant,
+} from 'src/application/models/graphql/queries/getProductOptionsQuery';
+
+/** A dropdown selection state: option name → chosen value. */
+export type VariantSelection = Record<string, string>;
+
+/**
+ * Imperative variant-details fetch for click-driven flows (the mount-driven
+ * useProductDetails hook is a poor fit when the fetch should ride a button's
+ * pending state). Resolves undefined when the product has no options data.
+ *
+ * @throws on network/HTTP failure or GraphQL errors
+ */
+export const fetchProductDetails = (productId: string): Promise<ProductDetails | undefined> =>
+  CommerceApiClient.retrieveProductDetails(productId);
+
+/**
+ * A product needs the variant selector when there is more than one variant to
+ * choose between and at least one option actually offers a choice.
+ */
+export const needsVariantSelection = (
+  details: ProductDetails | undefined,
+): details is ProductDetails =>
+  !!details && details.variants.length > 1 && details.options.some(o => o.values.length > 1);
+
+/** The variantId to add directly when the product has exactly one variant. */
+export const getSingleVariantId = (details: ProductDetails | undefined): string | undefined =>
+  details && details.variants.length === 1 ? details.variants[0].variantId : undefined;
+
+/**
+ * Initial dropdown state: the options of the first available variant, falling
+ * back to the first variant, falling back to the first value of each option —
+ * so the selector opens in an addable state whenever possible.
+ */
+export const getDefaultVariantSelection = (details: ProductDetails): VariantSelection => {
+  const defaultVariant = details.variants.find(v => v.available) ?? details.variants[0];
+  if (defaultVariant) {
+    return Object.fromEntries(defaultVariant.options.map(({ name, value }) => [name, value]));
+  }
+  return Object.fromEntries(
+    details.options.filter(o => o.values.length > 0).map(o => [o.name, o.values[0]]),
+  );
+};
+
+/**
+ * The variant whose options exactly match the selection (every option name in
+ * the variant agrees with the selected value, and counts match), or undefined
+ * when the combination does not exist.
+ */
+export const findVariantForSelection = (
+  details: ProductDetails,
+  selection: VariantSelection,
+): ProductVariant | undefined =>
+  details.variants.find(
+    variant =>
+      variant.options.length === Object.keys(selection).length &&
+      variant.options.every(({ name, value }) => selection[name] === value),
+  );

package/src/hooks/TrackComponentVisibleEvent/useTrackComponentVisibleEvent.ts

@@ -18,6 +18,14 @@ import {
  * @param rootMargin - Root margin for the intersection observer (defaults to 0px).
  * @param enabled - Whether tracking is enabled (defaults to true).
  */
+const safeNow = (): number | undefined => {
+  try {
+    return typeof window !== 'undefined' ? window.performance?.now?.() : undefined;
+  } catch {
+    return undefined;
+  }
+};
+
 export const useTrackComponentVisibleEvent = (
   element: RefObject<HTMLElement>,
   eventProps?: Record<string, unknown>,
@@ -28,6 +36,12 @@ export const useTrackComponentVisibleEvent = (
   const hasTrackedEvent = useRef(false);
   const { trackEvent } = useAmplitude();
   const variantInfo = useAtomValue(pageVariantInfoAtom);
+  // Captured on first render, not when the event fires: Widget Rendered is
+  // emitted at visibility, which for below-the-fold widgets can be long
+  // after the widget actually rendered. performance.now() is relative to
+  // navigation start, so this reads as "ms from initial page load to
+  // widget render".
+  const renderOffsetMs = useRef(safeNow()).current;
 
   useEffect(() => {
     console.debug('[useTrackComponentVisibleEvent] effect ran', {
@@ -63,6 +77,7 @@ export const useTrackComponentVisibleEvent = (
           widget: eventProps?.widget_type,
         },
         context: variantInfo ? extractPageContext(variantInfo as PageVariantInfo) : null,
+        'performance.render_offset_ms': renderOffsetMs,
       },
     });
     hasTrackedEvent.current = true;

package/src/hooks/WidgetInteraction/types.ts

@@ -30,7 +30,7 @@ export enum WidgetInteractionPageType {
   HOMEPAGE = 'homepage',
   SEARCH = 'search',
   OTHER = 'other',
-  FULL_PAGE = 'full_page',
+  ADAPTIVE_STOREFRONT = 'adaptive_storefront',
 }
 
 export enum WidgetInteractionComponent {
@@ -61,6 +61,8 @@ export enum WidgetInteractionType {
   SUGGESTION_SCROLLED = 'suggestion_scrolled',
   LINK_CLICKED = 'link_clicked',
   PRODUCT_CARD_CLICKED = 'product_card_clicked',
+  ADD_TO_CART_CLICKED = 'add_to_cart_clicked',
+  ADD_TO_CART_FAILED = 'add_to_cart_failed',
   TEXT_LINK_CLICKED = 'text_link_clicked',
   ARTICLE_LINK_CLICKED = 'article_link_clicked',
   REVIEW_CARD_CLICKED = 'review_card_clicked',
@@ -69,6 +71,9 @@ export enum WidgetInteractionType {
   VOICE_TRANSCRIPTION_STARTED = 'voice_transcription_started',
   VOICE_TRANSCRIPTION_COMPLETED = 'voice_transcription_completed',
   OVERLAY_DISMISSED = 'overlay_dismissed',
+  VARIANT_SELECTOR_OPENED = 'variant_selector_opened',
+  VARIANT_OPTION_SELECTED = 'variant_option_selected',
+  VARIANT_SELECTOR_DISMISSED = 'variant_selector_dismissed',
 }
 
 export enum InteractionClass {
@@ -87,6 +92,8 @@ export const INTERACTION_TYPE_CLASS: Record<WidgetInteractionType, InteractionCl
   [WidgetInteractionType.SUGGESTION_SCROLLED]: InteractionClass.PASSIVE,
   [WidgetInteractionType.LINK_CLICKED]: InteractionClass.INTENTIONAL,
   [WidgetInteractionType.PRODUCT_CARD_CLICKED]: InteractionClass.INTENTIONAL,
+  [WidgetInteractionType.ADD_TO_CART_CLICKED]: InteractionClass.INTENTIONAL,
+  [WidgetInteractionType.ADD_TO_CART_FAILED]: InteractionClass.PASSIVE,
   [WidgetInteractionType.TEXT_LINK_CLICKED]: InteractionClass.INTENTIONAL,
   [WidgetInteractionType.ARTICLE_LINK_CLICKED]: InteractionClass.INTENTIONAL,
   [WidgetInteractionType.REVIEW_CARD_CLICKED]: InteractionClass.INTENTIONAL,
@@ -95,6 +102,9 @@ export const INTERACTION_TYPE_CLASS: Record<WidgetInteractionType, InteractionCl
   [WidgetInteractionType.VOICE_TRANSCRIPTION_STARTED]: InteractionClass.INTENTIONAL,
   [WidgetInteractionType.VOICE_TRANSCRIPTION_COMPLETED]: InteractionClass.INTENTIONAL,
   [WidgetInteractionType.OVERLAY_DISMISSED]: InteractionClass.NAVIGATIONAL,
+  [WidgetInteractionType.VARIANT_SELECTOR_OPENED]: InteractionClass.NAVIGATIONAL,
+  [WidgetInteractionType.VARIANT_OPTION_SELECTED]: InteractionClass.INTENTIONAL,
+  [WidgetInteractionType.VARIANT_SELECTOR_DISMISSED]: InteractionClass.NAVIGATIONAL,
 };
 
 export type URL = {
@@ -153,6 +163,14 @@ export type ProductCardClicked = {
   product_card_clicked: Product;
 };
 
+export type AddToCartClicked = {
+  add_to_cart_clicked: Product;
+};
+
+export type AddToCartFailed = {
+  add_to_cart_failed: Product;
+};
+
 export type ReviewCardClicked = {
   review_card_clicked: Review;
 };
@@ -165,6 +183,24 @@ export type VoiceTranscription = {
   transcription: string;
 };
 
+export type SelectedVariantOption = {
+  product_id: string;
+  option_name: string;
+  option_value: string;
+};
+
+export type VariantSelectorOpened = {
+  variant_selector_opened: Product;
+};
+
+export type VariantOptionSelected = {
+  variant_option_selected: SelectedVariantOption;
+};
+
+export type VariantSelectorDismissed = {
+  variant_selector_dismissed: Product;
+};
+
 export type WidgetInteractionData =
   | SuggestionScrolled
   | SuggestionClicked
@@ -174,6 +210,11 @@ export type WidgetInteractionData =
   | TextLinkClicked
   | ArticleLinkClicked
   | ProductCardClicked
+  | AddToCartClicked
+  | AddToCartFailed
   | ReviewCardClicked
   | MessageSubmitted
-  | VoiceTranscription;
+  | VoiceTranscription
+  | VariantSelectorOpened
+  | VariantOptionSelected
+  | VariantSelectorDismissed;

package/src/hooks/WidgetInteraction/utils.ts

@@ -36,7 +36,7 @@ export const extractPageContext = (
     case VariantTypeEnum.FullPageSalesAgent:
       return {
         page_id: (pageVariant as FullPageSalesAgentVariantInfo).url,
-        page_type: WidgetInteractionPageType.FULL_PAGE,
+        page_type: WidgetInteractionPageType.ADAPTIVE_STOREFRONT,
       };
     default:
       return null;

package/src/services/amplitudeService/__tests__/amplitudeService.test.ts

@@ -105,8 +105,8 @@ describe('AmplitudeService', () => {
   };
 
   describe('Initialization', () => {
-    it('should initialize Amplitude client when all required config is provided', () => {
-      createService();
+    it('should initialize Amplitude client when all required config is provided', async () => {
+      await createService().initialized();
 
       expect(mockInit).toHaveBeenCalledWith(
         validApiKey,
@@ -516,9 +516,9 @@ describe('AmplitudeService', () => {
         configurable: true,
       });
 
-      createService({
+      await createService({
         show: true,
-      });
+      }).initialized();
 
       // Simulate a Page Viewed event by calling the enrichment plugin
       // The enrichment is added during initialization
@@ -564,7 +564,7 @@ describe('AmplitudeService', () => {
         configurable: true,
       });
 
-      createService();
+      await createService().initialized();
 
       const enrichmentCall = mockAdd.mock.calls[0];
       const enrichment = enrichmentCall[0];
@@ -580,7 +580,7 @@ describe('AmplitudeService', () => {
     });
 
     it('should not enrich non-specified events', async () => {
-      createService();
+      await createService().initialized();
 
       const enrichmentCall = mockAdd.mock.calls[0];
       const enrichment = enrichmentCall[0];
@@ -659,8 +659,8 @@ describe('AmplitudeService', () => {
   });
 
   describe('Session replay initialization', () => {
-    it('should disable session replay by default', () => {
-      createService();
+    it('should disable session replay by default', async () => {
+      await createService().initialized();
 
       // Session replay is always disabled in the current implementation
       expect(mockInit).toHaveBeenCalledWith(

package/src/services/amplitudeService/amplitudeService.ts

@@ -1,4 +1,3 @@
-import { createInstance } from '@amplitude/analytics-browser';
 import { EventsDispatcher, SpiffyEvent } from 'src/events';
 import { LocalStorageKeys } from 'src/contexts/localStorageContext';
 import Logger from 'src/application/logging/logger';
@@ -8,7 +7,7 @@ import type {
   Event,
   ServerZoneType,
 } from '@amplitude/analytics-types';
-import { FeatureFlagService } from 'src/contexts/featureFlagServiceContext/featureFlagServiceContext';
+import { FeatureFlagService } from 'src/services/featureFlagService';
 import { WidgetTypeV3 } from 'src/contexts/typesV3';
 import { ChatElementDisplayLocationV3 } from 'src/application/models/chatElementDisplayLocationV3';
 import { ExperimentNamespace, OrgConfigExperimentAssignment } from 'src/application/models';
@@ -80,24 +79,36 @@ export class AmplitudeService {
 
   private config: AmplitudeServiceConfig;
 
+  private initPromise: Promise<void>;
+
   constructor(config: AmplitudeServiceConfig) {
     this.config = config;
-    this.initialize();
+    this.initPromise = this.initialize();
   }
 
   get isMockApiKey(): boolean {
     return this.config.amplitudeApiKey === 'mock-amplitude-key';
   }
 
+  // Must not depend on `amplitudeClient`: the SDK now loads via dynamic
+  // import, and AmplitudeProvider unmounts its entire subtree while
+  // isReady is false — gating on the client would block widget rendering
+  // on the analytics chunk download. Events awaited in trackEvent queue
+  // behind `initPromise` instead.
   get isReady(): boolean {
     return Boolean(
       this.config.userId &&
       this.config.featureFlagService &&
       this.config.amplitudeApiKey &&
-      this.amplitudeClient,
+      !this.isMockApiKey,
     );
   }
 
+  /** Resolves once SDK initialization has settled (never rejects). */
+  initialized(): Promise<void> {
+    return this.initPromise;
+  }
+
   private getLocalStorageItem(key: string): string | null {
     if (this.config.getLocalStorageItem) {
       return this.config.getLocalStorageItem(key);
@@ -246,7 +257,7 @@ export class AmplitudeService {
     return enrichment;
   }
 
-  private initialize(): void {
+  private async initialize(): Promise<void> {
     const isReady = Boolean(
       this.config.userId && this.config.featureFlagService && this.config.amplitudeApiKey,
     );
@@ -270,25 +281,32 @@ export class AmplitudeService {
     }
 
     if (!this.amplitudeClient) {
-      const currentAmplitudeInstance: BrowserClient = createInstance();
-
-      currentAmplitudeInstance.add(this.getEventTrackingEnrichment());
-      currentAmplitudeInstance.init(this.config.amplitudeApiKey, this.config.userId, {
-        serverZone: this.config.dataResidency as ServerZoneType,
-        trackingOptions: {
-          ipAddress: true,
-        },
-        autocapture: {
-          attribution: true,
-          pageViews: {
-            trackHistoryChanges: 'pathOnly',
+      try {
+        // Dynamic import keeps the Amplitude SDK out of the eager
+        // injection-bundle chunk; trackEvent queues behind initPromise.
+        const { createInstance } = await import('@amplitude/analytics-browser');
+        const currentAmplitudeInstance: BrowserClient = createInstance();
+
+        currentAmplitudeInstance.add(this.getEventTrackingEnrichment());
+        currentAmplitudeInstance.init(this.config.amplitudeApiKey, this.config.userId, {
+          serverZone: this.config.dataResidency as ServerZoneType,
+          trackingOptions: {
+            ipAddress: true,
           },
-          sessions: false,
-          formInteractions: false,
-          fileDownloads: false,
-        },
-      });
-      this.amplitudeClient = currentAmplitudeInstance;
+          autocapture: {
+            attribution: true,
+            pageViews: {
+              trackHistoryChanges: 'pathOnly',
+            },
+            sessions: false,
+            formInteractions: false,
+            fileDownloads: false,
+          },
+        });
+        this.amplitudeClient = currentAmplitudeInstance;
+      } catch (err) {
+        logger.logError('Failed to load or initialize the Amplitude SDK', err);
+      }
     }
   }
 
@@ -296,6 +314,7 @@ export class AmplitudeService {
     switch (widgetType) {
       case WidgetTypeV3.FloatingButtonV3:
         return 'floating_button';
+      case WidgetTypeV3.TypingAnimationV3:
       case WidgetTypeV3.ChatPreviewV3:
       case WidgetTypeV3.SocialProofV3:
         return 'embedded_widget';
@@ -395,6 +414,7 @@ export class AmplitudeService {
     alsoSendToGoogleAnalytics = false,
   }: TrackEventParams): Promise<void> {
     if (this.isMockApiKey) return;
+    await this.initPromise;
     logger.logDebug('Submitting event', eventName);
     try {
       const decoratedEventName = AmplitudeService.decorateEventName(eventName);

package/src/services/enviveConfigService/__tests__/enviveConfigService.test.ts

@@ -0,0 +1,208 @@
+import { EnviveConfigService } from '../enviveConfigService';
+
+const mockFetch = vi.fn();
+globalThis.fetch = mockFetch;
+
+const ORG_CONFIG_RESPONSE = {
+  org: {
+    org: {
+      id: 'org-1',
+      short_name: 'test-org',
+      display_name: 'Test Org',
+      domain: 'test.com',
+      status: 'active',
+      created_at: '2024-01-01T00:00:00.000Z',
+      updated_at: '2024-01-01T00:00:00.000Z',
+    },
+  },
+  gates: [],
+};
+
+function makeOkOrgConfigFetch(overrides: Record<string, unknown> = {}) {
+  mockFetch.mockResolvedValueOnce({
+    ok: true,
+    json: () => Promise.resolve({ ...ORG_CONFIG_RESPONSE, ...overrides }),
+  });
+}
+
+// productsConfig has no colors, so fetchGraphQLConfig falls back to its mock
+// config (see fetchGraphQLConfig.test.ts "no colors fallback") - fine here
+// since these tests only care about caching/fetch-count behaviour.
+function makeOkGraphqlFetch() {
+  mockFetch.mockResolvedValueOnce({
+    ok: true,
+    json: () => Promise.resolve({ data: { me: { getProductsConfigByVersion: {} } } }),
+  });
+}
+
+function makeService(
+  overrides: Partial<ConstructorParameters<typeof EnviveConfigService>[0]> = {},
+) {
+  return new EnviveConfigService({
+    baseUrl: 'https://api.example.com',
+    apiKey: 'key',
+    userId: 'user-1',
+    namespace: 'spiffy-react-components',
+    source: 'app',
+    ...overrides,
+  });
+}
+
+beforeEach(() => {
+  vi.clearAllMocks();
+  sessionStorage.clear();
+  window.history.replaceState({}, '', '/');
+});
+
+afterEach(() => {
+  vi.useRealTimers();
+  vi.restoreAllMocks();
+});
+
+describe('EnviveConfigService caching', () => {
+  it('fetches org config + GraphQL config on a cold cache', async () => {
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+
+    const result = await makeService().getEnviveConfig();
+
+    expect(mockFetch).toHaveBeenCalledTimes(2);
+    expect(result.org.org.id).toBe('org-1');
+  });
+
+  it('serves a warm cache to a new instance with identical params without hitting the network', async () => {
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService().getEnviveConfig();
+    expect(mockFetch).toHaveBeenCalledTimes(2);
+
+    // A fresh instance (as happens on the next page navigation) should read
+    // from the sessionStorage cache instead of refetching.
+    const result = await makeService().getEnviveConfig();
+
+    expect(mockFetch).toHaveBeenCalledTimes(2);
+    expect(result.org.org.id).toBe('org-1');
+  });
+
+  it('refetches once the cache entry has expired past the 5-minute TTL', async () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date('2026-01-01T00:00:00.000Z'));
+
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService().getEnviveConfig();
+    expect(mockFetch).toHaveBeenCalledTimes(2);
+
+    vi.setSystemTime(new Date('2026-01-01T00:05:01.000Z'));
+
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService().getEnviveConfig();
+
+    expect(mockFetch).toHaveBeenCalledTimes(4);
+  });
+
+  it.each(['envive_config_version', 'spiffy_config_version'])(
+    'always bypasses the cache (read and write) when %s is present',
+    async param => {
+      window.history.replaceState({}, '', `/?${param}=1.2.3`);
+
+      makeOkOrgConfigFetch();
+      makeOkGraphqlFetch();
+      await makeService().getEnviveConfig();
+      expect(mockFetch).toHaveBeenCalledTimes(2);
+
+      makeOkOrgConfigFetch();
+      makeOkGraphqlFetch();
+      await makeService().getEnviveConfig();
+
+      // No cache read/write happened, so a second instance refetches instead
+      // of reusing anything the first instance stored.
+      expect(mockFetch).toHaveBeenCalledTimes(4);
+    },
+  );
+
+  it('does not read a version-pinned cache entry after the override is removed', async () => {
+    window.history.replaceState({}, '', '/?envive_config_version=1.2.3');
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService().getEnviveConfig();
+
+    window.history.replaceState({}, '', '/');
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService().getEnviveConfig();
+
+    expect(mockFetch).toHaveBeenCalledTimes(4);
+  });
+
+  it('keeps separate cache entries per userId', async () => {
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService({ userId: 'user-1' }).getEnviveConfig();
+    expect(mockFetch).toHaveBeenCalledTimes(2);
+
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService({ userId: 'user-2' }).getEnviveConfig();
+
+    expect(mockFetch).toHaveBeenCalledTimes(4);
+  });
+
+  it('keeps separate cache entries per namespace/source/baseUrl/apiKey', async () => {
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService({ namespace: 'ns-a' }).getEnviveConfig();
+    expect(mockFetch).toHaveBeenCalledTimes(2);
+
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await makeService({ namespace: 'ns-b' }).getEnviveConfig();
+
+    expect(mockFetch).toHaveBeenCalledTimes(4);
+  });
+
+  it('fails open and still returns config when sessionStorage.setItem throws', async () => {
+    vi.spyOn(Storage.prototype, 'setItem').mockImplementation(() => {
+      throw new Error('quota exceeded');
+    });
+
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+
+    const result = await makeService().getEnviveConfig();
+
+    expect(result.org.org.id).toBe('org-1');
+  });
+
+  it('fails open and refetches when sessionStorage.getItem throws', async () => {
+    vi.spyOn(Storage.prototype, 'getItem').mockImplementation(() => {
+      throw new Error('storage disabled');
+    });
+
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+
+    const result = await makeService().getEnviveConfig();
+
+    expect(result.org.org.id).toBe('org-1');
+  });
+
+  it('fails open and refetches when a cached entry is corrupted JSON', async () => {
+    const service = makeService();
+    // Seed a corrupted entry under whatever key the service reads from by
+    // populating every session storage key with garbage after a real write,
+    // then corrupting it directly.
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    await service.getEnviveConfig();
+    const [key] = Object.keys(sessionStorage);
+    sessionStorage.setItem(key, 'not json');
+
+    makeOkOrgConfigFetch();
+    makeOkGraphqlFetch();
+    const result = await makeService().getEnviveConfig();
+
+    expect(result.org.org.id).toBe('org-1');
+  });
+});