@coframe/sdk 1.1.2 → 1.1.4

package/dist/pkg/cf.cjs.js

@@ -1105,8 +1105,11 @@ function createSession(data) {
         console.warn('[Coframe] cannot send event beacon, feature unavailable');
     }
 }
-async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, headers) {
+async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, previewVariantId, headers) {
     const payload = { projectId, currentUrl };
+    if (previewVariantId) {
+        payload.previewVariantId = previewVariantId;
+    }
     const safe = sanitizeUserContext(userContext);
     if (safe) {
         payload.userContext = safe;
@@ -1204,10 +1207,10 @@ const executeJs = (jsCode, args = {}, opts = {}) => {
         w.Coframe.vars[elKey] = opts.elementRef;
     }
     const invocation = opts.isExpression
-        ? `(${jsCode})(__args)`
+        ? `(\n${jsCode}\n)(__args)`
         : opts.elementRef
-            ? `(function(el){ ${jsCode} })(__args.el)`
-            : `(function(){ ${jsCode} })()`;
+            ? `(function(el){\n${jsCode}\n})(__args.el)`
+            : `(function(){\n${jsCode}\n})()`;
     const ranKey = `${key}_ran`;
     const script = document.createElement('script');
     script.id = `coframe-script-${key}`;
@@ -1243,6 +1246,7 @@ const executeJs = (jsCode, args = {}, opts = {}) => {
     return value;
 };
 const applyJavascriptModification = (element, args, logger, nonce, logMetadata = {}) => {
+    var _a, _b;
     const javascript = args.js;
     try {
         if (!javascript) {
@@ -1264,9 +1268,11 @@ const applyJavascriptModification = (element, args, logger, nonce, logMetadata =
         if (logger === null || logger === void 0 ? void 0 : logger.error) {
             logger.error('Error executing JavaScript:', 'error_execute_js', {
                 ...logMetadata,
-                error,
+                error: error instanceof Error
+                    ? error.stack || error.message
+                    : String(error),
                 javascript,
-                element,
+                element: (_b = (_a = element.outerHTML) === null || _a === void 0 ? void 0 : _a.slice(0, 200)) !== null && _b !== void 0 ? _b : element.tagName,
             });
         }
         else {
@@ -2293,7 +2299,7 @@ function checkAllAudiences(metadata, project, personalizationHeaders, currentPag
     }
     return result;
 }
-async function getVariantsAndElements(personalizationHeaders, project, previewVariantId, userToken, currentPageUrl, languages, browserPlatform, logger, nonce, laneClaims = {}) {
+async function getVariantsAndElements(personalizationHeaders, project, previewVariantId, userToken, currentPageUrl, languages, browserPlatform, logger, nonce, laneClaims = {}, silentFallback = false) {
     var _a, _b;
     const experimentsInfo = [];
     const variantsAndElements = [];
@@ -2322,10 +2328,13 @@ async function getVariantsAndElements(personalizationHeaders, project, previewVa
                 hasActivatedFrames: true,
             });
         }
-        if (!skipAlert) {
+        if (!skipAlert && !silentFallback) {
             window.alert(`[Coframe] Variant preview unavailable: ${previewVariantId}.`);
         }
-        return buildResponse({});
+        if (silentFallback) ;
+        else {
+            return buildResponse({});
+        }
     }
     const userVisitCount = Number.parseInt(getCookie(VISIT_COUNT_COOKIE_KEY) || '0', 10);
     const validatedClaims = validateClaims(laneClaims, project.lanes);
@@ -2596,6 +2605,125 @@ function observeUrlChanges(baseUrlMatch, onUrlChange) {
     patchHistoryMethod('replaceState');
 }
 
+const TIMEOUT_MAX_MS = 5000;
+function getFeatureFlagValue(cmd) {
+    if (cmd.featureFlagSet !== undefined)
+        return cmd.featureFlagSet;
+    if (typeof cmd.emit === 'object' &&
+        cmd.emit !== null &&
+        'featureFlagSet' in cmd.emit) {
+        return cmd.emit.featureFlagSet;
+    }
+    return undefined;
+}
+async function resolveFeatureFlag(Coframe, timeoutMs) {
+    const cmd = await waitForCmd((cmd) => typeof getFeatureFlagValue(cmd) === 'boolean', Coframe, timeoutMs);
+    if (!cmd)
+        return undefined;
+    return getFeatureFlagValue(cmd);
+}
+async function resolveConfig(Coframe, revealPage) {
+    const logger = Coframe.logger;
+    const configCmd = await waitForCmd((cmd) => !!cmd.config, Coframe);
+    if (!configCmd) {
+        logger.error('Failed to wait for config cmd', 'wait_for_cmd_timeout');
+        return null;
+    }
+    const config = configCmd.config;
+    const timeoutMs = (config === null || config === void 0 ? void 0 : config.timeoutMs)
+        ? Math.min(config.timeoutMs, TIMEOUT_MAX_MS)
+        : TIMEOUT_MAX_MS;
+    const integrationStartTime = (config === null || config === void 0 ? void 0 : config.startTime)
+        ? new Date(config.startTime)
+        : null;
+    const executionStartTime = new Date();
+    Coframe.batchSize = config.batchSize || 32;
+    const gracefulExit = (msg) => {
+        console.warn(`[Coframe] ${msg}`);
+        revealPage();
+        return null;
+    };
+    if (config.waitForFeatureFlag) {
+        const flag = await resolveFeatureFlag(Coframe, timeoutMs);
+        if (flag === undefined) {
+            return gracefulExit('Feature flag was not set after timeout, graceful exit');
+        }
+        if (flag === false) {
+            return gracefulExit('Feature flag is set to false, graceful exit');
+        }
+    }
+    const projectId = config === null || config === void 0 ? void 0 : config.projectId;
+    const warnMissingVariant = () => {
+        if (applyVariantChangesStarted) {
+            logger.warn('Failed to wait for variant rendered command', 'missing_variant_rendered');
+        }
+    };
+    waitForCmd((cmd) => cmd.variantRendered === true || cmd.emit === 'variantRendered', Coframe, timeoutMs)
+        .then((cmd) => {
+        if (!cmd) {
+            warnMissingVariant();
+        }
+    })
+        .finally(() => {
+        revealPage();
+    });
+    if (!projectId) {
+        logger.error('No project ID', 'no_project_id', {
+            description: 'No Coframe Page ID',
+        });
+        variantRendered();
+        return null;
+    }
+    Coframe.projectId = projectId;
+    const urlParams = getCurrentUrlSearchParams();
+    const urlVariantId = urlParams.get('coframe_variant_id');
+    const shouldSendEventsParam = urlParams.get('coframe_should_send_events');
+    const keepForSession = urlParams.get('keep_preview_for_session') === 'true';
+    let previewVariantId = null;
+    let isSessionVariant = false;
+    if (urlVariantId) {
+        previewVariantId = urlVariantId;
+        if (keepForSession) {
+            persistPreviewVariantId(urlVariantId);
+        }
+    }
+    else {
+        const stored = readPreviewVariantId();
+        if (stored) {
+            previewVariantId = stored;
+            isSessionVariant = true;
+        }
+    }
+    setForceSendEvents(shouldSendEventsParam === 'true');
+    setIsPreviewVariant(!!previewVariantId);
+    setWaitingForCookies(!!config.waitForCookiesEnabled);
+    return {
+        config,
+        timeoutMs,
+        projectId,
+        previewVariantId,
+        isSessionVariant,
+        integrationStartTime,
+        executionStartTime,
+    };
+}
+const SESSION_VARIANT_KEY = 'coframe.preview_variant';
+function readPreviewVariantId() {
+    try {
+        return sessionStorage.getItem(SESSION_VARIANT_KEY);
+    }
+    catch (_a) {
+        return null;
+    }
+}
+function persistPreviewVariantId(variantId) {
+    try {
+        sessionStorage.setItem(SESSION_VARIANT_KEY, variantId);
+    }
+    catch (_a) {
+    }
+}
+
 function startSession(Coframe, cookiesEnabled, executionStartTime, personalizationHeaders) {
     const sessionPayload = [
         Coframe,
@@ -2907,9 +3035,29 @@ function setupTracking(Coframe, projectResult, previewVariantId, executionStartT
     return analytics;
 }
 
-async function awaitHydration(config, Coframe) {
+function resolvePreview(pageUrl, previewVariantId, isSessionVariant) {
+    let urlPreviewVariantId = null;
+    try {
+        urlPreviewVariantId = new URL(pageUrl).searchParams.get('coframe_variant_id');
+    }
+    catch (_a) {
+        urlPreviewVariantId = getCurrentUrlSearchParams().get('coframe_variant_id');
+    }
+    if (urlPreviewVariantId) {
+        return { previewVariantId: urlPreviewVariantId, isSessionVariant: false };
+    }
+    if (previewVariantId) {
+        return { previewVariantId, isSessionVariant };
+    }
+    const stored = readPreviewVariantId();
+    return { previewVariantId: stored, isSessionVariant: !!stored };
+}
+async function awaitHydration(config, Coframe, project) {
+    var _a, _b;
     if (!config.waitForHydration)
         return true;
+    if (!((_a = project.frames) === null || _a === void 0 ? void 0 : _a.length) && !((_b = project.tags) === null || _b === void 0 ? void 0 : _b.length))
+        return true;
     const cmd = await waitForCmd((cmd) => cmd.pageHydrated === true || cmd.emit === 'pageHydrated', Coframe);
     if (!cmd) {
         Coframe.logger.warn('Failed to wait for page hydrated command', 'wait_for_cmd_timeout');
@@ -2936,7 +3084,7 @@ function setupFlushInterval(projectId) {
     }
     flushInterval = setInterval(() => flushQueuedEvents(projectId), FLUSH_EVENTS_TIME);
 }
-function setupSPANavigation(Coframe, project, config, applyVariants) {
+function setupSPANavigation(Coframe, project, config, previewVariantId, isSessionVariant, applyVariants) {
     var _a;
     if (!((_a = project === null || project === void 0 ? void 0 : project.settings) === null || _a === void 0 ? void 0 : _a.mutation_observer_active))
         return;
@@ -2975,7 +3123,8 @@ function setupSPANavigation(Coframe, project, config, applyVariants) {
         }
         else {
             try {
-                const result = await fetchProjectFromEdge(Coframe.projectId, newPageUrl, signal, config.userContext);
+                const preview = resolvePreview(newPageUrl, previewVariantId, isSessionVariant);
+                const result = await fetchProjectFromEdge(Coframe.projectId, newPageUrl, signal, config.userContext, preview.previewVariantId || undefined);
                 if (signal.aborted)
                     return;
                 if (result) {
@@ -3019,15 +3168,15 @@ function persistLaneClaims(claims, logger) {
         setCookie(LANE_COOKIE_KEY, encodeURIComponent(serialized), logger);
     }
 }
-function createApplyVariants(Coframe, config, previewVariantId, executionStartTime, analytics, personalizationHeaders, laneStore) {
+function createApplyVariants(Coframe, config, previewVariantId, isSessionVariant, executionStartTime, analytics, personalizationHeaders, laneStore) {
+    let isFirstApply = true;
     return async (pageUrl, pageProject) => {
-        const sessionId = generateUUID();
+        const sessionId = isFirstApply ? Coframe.sessionId : generateUUID();
+        isFirstApply = false;
         Coframe.sessionId = sessionId;
-        const urlPreviewVariantId = getCurrentUrlSearchParams().get('coframe_variant_id') || null;
-        const updatedPreviewVariantId = urlPreviewVariantId !== previewVariantId
-            ? urlPreviewVariantId
-            : previewVariantId;
-        const { variantsAndElements, experimentsInfo, hasActivatedFrames, laneClaims, } = await getVariantsAndElements(personalizationHeaders, pageProject, updatedPreviewVariantId, Coframe.userToken, pageUrl, getBrowserLanguages(), getBrowserPlatform(), Coframe.logger, config.nonce, laneStore.claims);
+        const preview = resolvePreview(pageUrl, previewVariantId, isSessionVariant);
+        setIsPreviewVariant(!!preview.previewVariantId);
+        const { variantsAndElements, experimentsInfo, hasActivatedFrames, laneClaims, } = await getVariantsAndElements(personalizationHeaders, pageProject, preview.previewVariantId, Coframe.userToken, pageUrl, getBrowserLanguages(), getBrowserPlatform(), Coframe.logger, config.nonce, laneStore.claims, preview.isSessionVariant);
         laneStore.claims = laneClaims;
         persistLaneClaims(laneClaims, Coframe.logger);
         Coframe.experimentInfo = experimentsInfo;
@@ -3050,9 +3199,9 @@ function createApplyVariants(Coframe, config, previewVariantId, executionStartTi
     };
 }
 async function modifyPage(Coframe, configResult, projectResult, analytics) {
-    const { config, timeoutMs, previewVariantId, integrationStartTime, executionStartTime, } = configResult;
+    const { config, timeoutMs, previewVariantId, isSessionVariant, integrationStartTime, executionStartTime, } = configResult;
     const { project: cdnProject, personalizationHeaders } = projectResult;
-    if (!(await awaitHydration(config, Coframe)))
+    if (!(await awaitHydration(config, Coframe, cdnProject)))
         return;
     if (cdnProject.tags) {
         executeTags(cdnProject.tags, Coframe.logger, config.nonce);
@@ -3061,7 +3210,7 @@ async function modifyPage(Coframe, configResult, projectResult, analytics) {
     if (!(await ensureBody(Coframe, cdnProject, timeoutMs, config.nonce)))
         return;
     const laneStore = { claims: readLaneClaims() };
-    const applyVariants = createApplyVariants(Coframe, config, previewVariantId, executionStartTime, analytics, personalizationHeaders, laneStore);
+    const applyVariants = createApplyVariants(Coframe, config, previewVariantId, isSessionVariant, executionStartTime, analytics, personalizationHeaders, laneStore);
     await applyVariants(getCurrentPageUrl(), cdnProject);
     if (!Coframe.variantsAndElements ||
         Coframe.variantsAndElements.length === 0) {
@@ -3069,96 +3218,10 @@ async function modifyPage(Coframe, configResult, projectResult, analytics) {
         variantRendered();
     }
     reportInitTiming(Coframe, cdnProject, integrationStartTime, executionStartTime);
-    setupSPANavigation(Coframe, cdnProject, config, applyVariants);
+    setupSPANavigation(Coframe, cdnProject, config, previewVariantId, isSessionVariant, applyVariants);
     setupFlushInterval(Coframe.projectId);
 }
 
-const TIMEOUT_MAX_MS = 5000;
-function getFeatureFlagValue(cmd) {
-    if (cmd.featureFlagSet !== undefined)
-        return cmd.featureFlagSet;
-    if (typeof cmd.emit === 'object' &&
-        cmd.emit !== null &&
-        'featureFlagSet' in cmd.emit) {
-        return cmd.emit.featureFlagSet;
-    }
-    return undefined;
-}
-async function resolveFeatureFlag(Coframe, timeoutMs) {
-    const cmd = await waitForCmd((cmd) => typeof getFeatureFlagValue(cmd) === 'boolean', Coframe, timeoutMs);
-    if (!cmd)
-        return undefined;
-    return getFeatureFlagValue(cmd);
-}
-async function resolveConfig(Coframe, revealPage) {
-    const logger = Coframe.logger;
-    const configCmd = await waitForCmd((cmd) => !!cmd.config, Coframe);
-    if (!configCmd) {
-        logger.error('Failed to wait for config cmd', 'wait_for_cmd_timeout');
-        return null;
-    }
-    const config = configCmd.config;
-    const timeoutMs = (config === null || config === void 0 ? void 0 : config.timeoutMs)
-        ? Math.min(config.timeoutMs, TIMEOUT_MAX_MS)
-        : TIMEOUT_MAX_MS;
-    const integrationStartTime = (config === null || config === void 0 ? void 0 : config.startTime)
-        ? new Date(config.startTime)
-        : null;
-    const executionStartTime = new Date();
-    Coframe.batchSize = config.batchSize || 32;
-    const gracefulExit = (msg) => {
-        console.warn(`[Coframe] ${msg}`);
-        revealPage();
-        return null;
-    };
-    if (config.waitForFeatureFlag) {
-        const flag = await resolveFeatureFlag(Coframe, timeoutMs);
-        if (flag === undefined) {
-            return gracefulExit('Feature flag was not set after timeout, graceful exit');
-        }
-        if (flag === false) {
-            return gracefulExit('Feature flag is set to false, graceful exit');
-        }
-    }
-    const projectId = config === null || config === void 0 ? void 0 : config.projectId;
-    const warnMissingVariant = () => {
-        if (applyVariantChangesStarted) {
-            logger.warn('Failed to wait for variant rendered command', 'missing_variant_rendered');
-        }
-    };
-    waitForCmd((cmd) => cmd.variantRendered === true || cmd.emit === 'variantRendered', Coframe, timeoutMs)
-        .then((cmd) => {
-        if (!cmd) {
-            warnMissingVariant();
-        }
-    })
-        .finally(() => {
-        revealPage();
-    });
-    if (!projectId) {
-        logger.error('No project ID', 'no_project_id', {
-            description: 'No Coframe Page ID',
-        });
-        variantRendered();
-        return null;
-    }
-    Coframe.projectId = projectId;
-    const urlParams = getCurrentUrlSearchParams();
-    const previewVariantId = urlParams.get('coframe_variant_id');
-    const shouldSendEventsParam = urlParams.get('coframe_should_send_events');
-    setForceSendEvents(shouldSendEventsParam === 'true');
-    setIsPreviewVariant(!!previewVariantId);
-    setWaitingForCookies(!!config.waitForCookiesEnabled);
-    return {
-        config,
-        timeoutMs,
-        projectId,
-        previewVariantId,
-        integrationStartTime,
-        executionStartTime,
-    };
-}
-
 async function resolveIdentity(config, Coframe, timeoutMs, gracefulExit) {
     const logger = Coframe.logger;
     let userToken;
@@ -3215,14 +3278,14 @@ async function resolveIdentity(config, Coframe, timeoutMs, gracefulExit) {
     return { userToken, applyCookieConsent, onConsentChange };
 }
 
-async function resolveProject(Coframe, previewVariantId, config) {
+async function resolveProject(Coframe, previewVariantId, isSessionVariant, config) {
     var _a;
     const logger = Coframe.logger;
     const projectData = (_a = findLastCmd((c) => !!c.projectData)) === null || _a === void 0 ? void 0 : _a.projectData;
     let personalizationHeaders = (projectData === null || projectData === void 0 ? void 0 : projectData.personalizationHeaders) || null;
-    let project = projectData === null || projectData === void 0 ? void 0 : projectData.project;
+    let project = isSessionVariant ? undefined : projectData === null || projectData === void 0 ? void 0 : projectData.project;
     if (!project) {
-        const edgeResult = await fetchProjectFromEdge(Coframe.projectId, config.currentUrl || getCurrentPageUrl(), undefined, config.userContext);
+        const edgeResult = await fetchProjectFromEdge(Coframe.projectId, config.currentUrl || getCurrentPageUrl(), undefined, config.userContext, previewVariantId || undefined);
         personalizationHeaders = (edgeResult === null || edgeResult === void 0 ? void 0 : edgeResult.personalizationHeaders) || null;
         project = (edgeResult === null || edgeResult === void 0 ? void 0 : edgeResult.project) || undefined;
     }
@@ -3314,7 +3377,7 @@ async function init(options) {
     const configResult = await resolveConfig(Coframe, revealPage);
     if (!configResult)
         return;
-    const projectResult = await resolveProject(Coframe, configResult.previewVariantId, configResult.config);
+    const projectResult = await resolveProject(Coframe, configResult.previewVariantId, configResult.isSessionVariant, configResult.config);
     if (!projectResult)
         return;
     Coframe.orgId = projectResult.project.org_id || '';

package/dist/pkg/cf.esm.mjs

@@ -1103,8 +1103,11 @@ function createSession(data) {
         console.warn('[Coframe] cannot send event beacon, feature unavailable');
     }
 }
-async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, headers) {
+async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, previewVariantId, headers) {
     const payload = { projectId, currentUrl };
+    if (previewVariantId) {
+        payload.previewVariantId = previewVariantId;
+    }
     const safe = sanitizeUserContext(userContext);
     if (safe) {
         payload.userContext = safe;
@@ -1202,10 +1205,10 @@ const executeJs = (jsCode, args = {}, opts = {}) => {
         w.Coframe.vars[elKey] = opts.elementRef;
     }
     const invocation = opts.isExpression
-        ? `(${jsCode})(__args)`
+        ? `(\n${jsCode}\n)(__args)`
         : opts.elementRef
-            ? `(function(el){ ${jsCode} })(__args.el)`
-            : `(function(){ ${jsCode} })()`;
+            ? `(function(el){\n${jsCode}\n})(__args.el)`
+            : `(function(){\n${jsCode}\n})()`;
     const ranKey = `${key}_ran`;
     const script = document.createElement('script');
     script.id = `coframe-script-${key}`;
@@ -1241,6 +1244,7 @@ const executeJs = (jsCode, args = {}, opts = {}) => {
     return value;
 };
 const applyJavascriptModification = (element, args, logger, nonce, logMetadata = {}) => {
+    var _a, _b;
     const javascript = args.js;
     try {
         if (!javascript) {
@@ -1262,9 +1266,11 @@ const applyJavascriptModification = (element, args, logger, nonce, logMetadata =
         if (logger === null || logger === void 0 ? void 0 : logger.error) {
             logger.error('Error executing JavaScript:', 'error_execute_js', {
                 ...logMetadata,
-                error,
+                error: error instanceof Error
+                    ? error.stack || error.message
+                    : String(error),
                 javascript,
-                element,
+                element: (_b = (_a = element.outerHTML) === null || _a === void 0 ? void 0 : _a.slice(0, 200)) !== null && _b !== void 0 ? _b : element.tagName,
             });
         }
         else {
@@ -2291,7 +2297,7 @@ function checkAllAudiences(metadata, project, personalizationHeaders, currentPag
     }
     return result;
 }
-async function getVariantsAndElements(personalizationHeaders, project, previewVariantId, userToken, currentPageUrl, languages, browserPlatform, logger, nonce, laneClaims = {}) {
+async function getVariantsAndElements(personalizationHeaders, project, previewVariantId, userToken, currentPageUrl, languages, browserPlatform, logger, nonce, laneClaims = {}, silentFallback = false) {
     var _a, _b;
     const experimentsInfo = [];
     const variantsAndElements = [];
@@ -2320,10 +2326,13 @@ async function getVariantsAndElements(personalizationHeaders, project, previewVa
                 hasActivatedFrames: true,
             });
         }
-        if (!skipAlert) {
+        if (!skipAlert && !silentFallback) {
             window.alert(`[Coframe] Variant preview unavailable: ${previewVariantId}.`);
         }
-        return buildResponse({});
+        if (silentFallback) ;
+        else {
+            return buildResponse({});
+        }
     }
     const userVisitCount = Number.parseInt(getCookie(VISIT_COUNT_COOKIE_KEY) || '0', 10);
     const validatedClaims = validateClaims(laneClaims, project.lanes);
@@ -2594,6 +2603,125 @@ function observeUrlChanges(baseUrlMatch, onUrlChange) {
     patchHistoryMethod('replaceState');
 }
 
+const TIMEOUT_MAX_MS = 5000;
+function getFeatureFlagValue(cmd) {
+    if (cmd.featureFlagSet !== undefined)
+        return cmd.featureFlagSet;
+    if (typeof cmd.emit === 'object' &&
+        cmd.emit !== null &&
+        'featureFlagSet' in cmd.emit) {
+        return cmd.emit.featureFlagSet;
+    }
+    return undefined;
+}
+async function resolveFeatureFlag(Coframe, timeoutMs) {
+    const cmd = await waitForCmd((cmd) => typeof getFeatureFlagValue(cmd) === 'boolean', Coframe, timeoutMs);
+    if (!cmd)
+        return undefined;
+    return getFeatureFlagValue(cmd);
+}
+async function resolveConfig(Coframe, revealPage) {
+    const logger = Coframe.logger;
+    const configCmd = await waitForCmd((cmd) => !!cmd.config, Coframe);
+    if (!configCmd) {
+        logger.error('Failed to wait for config cmd', 'wait_for_cmd_timeout');
+        return null;
+    }
+    const config = configCmd.config;
+    const timeoutMs = (config === null || config === void 0 ? void 0 : config.timeoutMs)
+        ? Math.min(config.timeoutMs, TIMEOUT_MAX_MS)
+        : TIMEOUT_MAX_MS;
+    const integrationStartTime = (config === null || config === void 0 ? void 0 : config.startTime)
+        ? new Date(config.startTime)
+        : null;
+    const executionStartTime = new Date();
+    Coframe.batchSize = config.batchSize || 32;
+    const gracefulExit = (msg) => {
+        console.warn(`[Coframe] ${msg}`);
+        revealPage();
+        return null;
+    };
+    if (config.waitForFeatureFlag) {
+        const flag = await resolveFeatureFlag(Coframe, timeoutMs);
+        if (flag === undefined) {
+            return gracefulExit('Feature flag was not set after timeout, graceful exit');
+        }
+        if (flag === false) {
+            return gracefulExit('Feature flag is set to false, graceful exit');
+        }
+    }
+    const projectId = config === null || config === void 0 ? void 0 : config.projectId;
+    const warnMissingVariant = () => {
+        if (applyVariantChangesStarted) {
+            logger.warn('Failed to wait for variant rendered command', 'missing_variant_rendered');
+        }
+    };
+    waitForCmd((cmd) => cmd.variantRendered === true || cmd.emit === 'variantRendered', Coframe, timeoutMs)
+        .then((cmd) => {
+        if (!cmd) {
+            warnMissingVariant();
+        }
+    })
+        .finally(() => {
+        revealPage();
+    });
+    if (!projectId) {
+        logger.error('No project ID', 'no_project_id', {
+            description: 'No Coframe Page ID',
+        });
+        variantRendered();
+        return null;
+    }
+    Coframe.projectId = projectId;
+    const urlParams = getCurrentUrlSearchParams();
+    const urlVariantId = urlParams.get('coframe_variant_id');
+    const shouldSendEventsParam = urlParams.get('coframe_should_send_events');
+    const keepForSession = urlParams.get('keep_preview_for_session') === 'true';
+    let previewVariantId = null;
+    let isSessionVariant = false;
+    if (urlVariantId) {
+        previewVariantId = urlVariantId;
+        if (keepForSession) {
+            persistPreviewVariantId(urlVariantId);
+        }
+    }
+    else {
+        const stored = readPreviewVariantId();
+        if (stored) {
+            previewVariantId = stored;
+            isSessionVariant = true;
+        }
+    }
+    setForceSendEvents(shouldSendEventsParam === 'true');
+    setIsPreviewVariant(!!previewVariantId);
+    setWaitingForCookies(!!config.waitForCookiesEnabled);
+    return {
+        config,
+        timeoutMs,
+        projectId,
+        previewVariantId,
+        isSessionVariant,
+        integrationStartTime,
+        executionStartTime,
+    };
+}
+const SESSION_VARIANT_KEY = 'coframe.preview_variant';
+function readPreviewVariantId() {
+    try {
+        return sessionStorage.getItem(SESSION_VARIANT_KEY);
+    }
+    catch (_a) {
+        return null;
+    }
+}
+function persistPreviewVariantId(variantId) {
+    try {
+        sessionStorage.setItem(SESSION_VARIANT_KEY, variantId);
+    }
+    catch (_a) {
+    }
+}
+
 function startSession(Coframe, cookiesEnabled, executionStartTime, personalizationHeaders) {
     const sessionPayload = [
         Coframe,
@@ -2905,9 +3033,29 @@ function setupTracking(Coframe, projectResult, previewVariantId, executionStartT
     return analytics;
 }
 
-async function awaitHydration(config, Coframe) {
+function resolvePreview(pageUrl, previewVariantId, isSessionVariant) {
+    let urlPreviewVariantId = null;
+    try {
+        urlPreviewVariantId = new URL(pageUrl).searchParams.get('coframe_variant_id');
+    }
+    catch (_a) {
+        urlPreviewVariantId = getCurrentUrlSearchParams().get('coframe_variant_id');
+    }
+    if (urlPreviewVariantId) {
+        return { previewVariantId: urlPreviewVariantId, isSessionVariant: false };
+    }
+    if (previewVariantId) {
+        return { previewVariantId, isSessionVariant };
+    }
+    const stored = readPreviewVariantId();
+    return { previewVariantId: stored, isSessionVariant: !!stored };
+}
+async function awaitHydration(config, Coframe, project) {
+    var _a, _b;
     if (!config.waitForHydration)
         return true;
+    if (!((_a = project.frames) === null || _a === void 0 ? void 0 : _a.length) && !((_b = project.tags) === null || _b === void 0 ? void 0 : _b.length))
+        return true;
     const cmd = await waitForCmd((cmd) => cmd.pageHydrated === true || cmd.emit === 'pageHydrated', Coframe);
     if (!cmd) {
         Coframe.logger.warn('Failed to wait for page hydrated command', 'wait_for_cmd_timeout');
@@ -2934,7 +3082,7 @@ function setupFlushInterval(projectId) {
     }
     flushInterval = setInterval(() => flushQueuedEvents(projectId), FLUSH_EVENTS_TIME);
 }
-function setupSPANavigation(Coframe, project, config, applyVariants) {
+function setupSPANavigation(Coframe, project, config, previewVariantId, isSessionVariant, applyVariants) {
     var _a;
     if (!((_a = project === null || project === void 0 ? void 0 : project.settings) === null || _a === void 0 ? void 0 : _a.mutation_observer_active))
         return;
@@ -2973,7 +3121,8 @@ function setupSPANavigation(Coframe, project, config, applyVariants) {
         }
         else {
             try {
-                const result = await fetchProjectFromEdge(Coframe.projectId, newPageUrl, signal, config.userContext);
+                const preview = resolvePreview(newPageUrl, previewVariantId, isSessionVariant);
+                const result = await fetchProjectFromEdge(Coframe.projectId, newPageUrl, signal, config.userContext, preview.previewVariantId || undefined);
                 if (signal.aborted)
                     return;
                 if (result) {
@@ -3017,15 +3166,15 @@ function persistLaneClaims(claims, logger) {
         setCookie(LANE_COOKIE_KEY, encodeURIComponent(serialized), logger);
     }
 }
-function createApplyVariants(Coframe, config, previewVariantId, executionStartTime, analytics, personalizationHeaders, laneStore) {
+function createApplyVariants(Coframe, config, previewVariantId, isSessionVariant, executionStartTime, analytics, personalizationHeaders, laneStore) {
+    let isFirstApply = true;
     return async (pageUrl, pageProject) => {
-        const sessionId = generateUUID();
+        const sessionId = isFirstApply ? Coframe.sessionId : generateUUID();
+        isFirstApply = false;
         Coframe.sessionId = sessionId;
-        const urlPreviewVariantId = getCurrentUrlSearchParams().get('coframe_variant_id') || null;
-        const updatedPreviewVariantId = urlPreviewVariantId !== previewVariantId
-            ? urlPreviewVariantId
-            : previewVariantId;
-        const { variantsAndElements, experimentsInfo, hasActivatedFrames, laneClaims, } = await getVariantsAndElements(personalizationHeaders, pageProject, updatedPreviewVariantId, Coframe.userToken, pageUrl, getBrowserLanguages(), getBrowserPlatform(), Coframe.logger, config.nonce, laneStore.claims);
+        const preview = resolvePreview(pageUrl, previewVariantId, isSessionVariant);
+        setIsPreviewVariant(!!preview.previewVariantId);
+        const { variantsAndElements, experimentsInfo, hasActivatedFrames, laneClaims, } = await getVariantsAndElements(personalizationHeaders, pageProject, preview.previewVariantId, Coframe.userToken, pageUrl, getBrowserLanguages(), getBrowserPlatform(), Coframe.logger, config.nonce, laneStore.claims, preview.isSessionVariant);
         laneStore.claims = laneClaims;
         persistLaneClaims(laneClaims, Coframe.logger);
         Coframe.experimentInfo = experimentsInfo;
@@ -3048,9 +3197,9 @@ function createApplyVariants(Coframe, config, previewVariantId, executionStartTi
     };
 }
 async function modifyPage(Coframe, configResult, projectResult, analytics) {
-    const { config, timeoutMs, previewVariantId, integrationStartTime, executionStartTime, } = configResult;
+    const { config, timeoutMs, previewVariantId, isSessionVariant, integrationStartTime, executionStartTime, } = configResult;
     const { project: cdnProject, personalizationHeaders } = projectResult;
-    if (!(await awaitHydration(config, Coframe)))
+    if (!(await awaitHydration(config, Coframe, cdnProject)))
         return;
     if (cdnProject.tags) {
         executeTags(cdnProject.tags, Coframe.logger, config.nonce);
@@ -3059,7 +3208,7 @@ async function modifyPage(Coframe, configResult, projectResult, analytics) {
     if (!(await ensureBody(Coframe, cdnProject, timeoutMs, config.nonce)))
         return;
     const laneStore = { claims: readLaneClaims() };
-    const applyVariants = createApplyVariants(Coframe, config, previewVariantId, executionStartTime, analytics, personalizationHeaders, laneStore);
+    const applyVariants = createApplyVariants(Coframe, config, previewVariantId, isSessionVariant, executionStartTime, analytics, personalizationHeaders, laneStore);
     await applyVariants(getCurrentPageUrl(), cdnProject);
     if (!Coframe.variantsAndElements ||
         Coframe.variantsAndElements.length === 0) {
@@ -3067,96 +3216,10 @@ async function modifyPage(Coframe, configResult, projectResult, analytics) {
         variantRendered();
     }
     reportInitTiming(Coframe, cdnProject, integrationStartTime, executionStartTime);
-    setupSPANavigation(Coframe, cdnProject, config, applyVariants);
+    setupSPANavigation(Coframe, cdnProject, config, previewVariantId, isSessionVariant, applyVariants);
     setupFlushInterval(Coframe.projectId);
 }
 
-const TIMEOUT_MAX_MS = 5000;
-function getFeatureFlagValue(cmd) {
-    if (cmd.featureFlagSet !== undefined)
-        return cmd.featureFlagSet;
-    if (typeof cmd.emit === 'object' &&
-        cmd.emit !== null &&
-        'featureFlagSet' in cmd.emit) {
-        return cmd.emit.featureFlagSet;
-    }
-    return undefined;
-}
-async function resolveFeatureFlag(Coframe, timeoutMs) {
-    const cmd = await waitForCmd((cmd) => typeof getFeatureFlagValue(cmd) === 'boolean', Coframe, timeoutMs);
-    if (!cmd)
-        return undefined;
-    return getFeatureFlagValue(cmd);
-}
-async function resolveConfig(Coframe, revealPage) {
-    const logger = Coframe.logger;
-    const configCmd = await waitForCmd((cmd) => !!cmd.config, Coframe);
-    if (!configCmd) {
-        logger.error('Failed to wait for config cmd', 'wait_for_cmd_timeout');
-        return null;
-    }
-    const config = configCmd.config;
-    const timeoutMs = (config === null || config === void 0 ? void 0 : config.timeoutMs)
-        ? Math.min(config.timeoutMs, TIMEOUT_MAX_MS)
-        : TIMEOUT_MAX_MS;
-    const integrationStartTime = (config === null || config === void 0 ? void 0 : config.startTime)
-        ? new Date(config.startTime)
-        : null;
-    const executionStartTime = new Date();
-    Coframe.batchSize = config.batchSize || 32;
-    const gracefulExit = (msg) => {
-        console.warn(`[Coframe] ${msg}`);
-        revealPage();
-        return null;
-    };
-    if (config.waitForFeatureFlag) {
-        const flag = await resolveFeatureFlag(Coframe, timeoutMs);
-        if (flag === undefined) {
-            return gracefulExit('Feature flag was not set after timeout, graceful exit');
-        }
-        if (flag === false) {
-            return gracefulExit('Feature flag is set to false, graceful exit');
-        }
-    }
-    const projectId = config === null || config === void 0 ? void 0 : config.projectId;
-    const warnMissingVariant = () => {
-        if (applyVariantChangesStarted) {
-            logger.warn('Failed to wait for variant rendered command', 'missing_variant_rendered');
-        }
-    };
-    waitForCmd((cmd) => cmd.variantRendered === true || cmd.emit === 'variantRendered', Coframe, timeoutMs)
-        .then((cmd) => {
-        if (!cmd) {
-            warnMissingVariant();
-        }
-    })
-        .finally(() => {
-        revealPage();
-    });
-    if (!projectId) {
-        logger.error('No project ID', 'no_project_id', {
-            description: 'No Coframe Page ID',
-        });
-        variantRendered();
-        return null;
-    }
-    Coframe.projectId = projectId;
-    const urlParams = getCurrentUrlSearchParams();
-    const previewVariantId = urlParams.get('coframe_variant_id');
-    const shouldSendEventsParam = urlParams.get('coframe_should_send_events');
-    setForceSendEvents(shouldSendEventsParam === 'true');
-    setIsPreviewVariant(!!previewVariantId);
-    setWaitingForCookies(!!config.waitForCookiesEnabled);
-    return {
-        config,
-        timeoutMs,
-        projectId,
-        previewVariantId,
-        integrationStartTime,
-        executionStartTime,
-    };
-}
-
 async function resolveIdentity(config, Coframe, timeoutMs, gracefulExit) {
     const logger = Coframe.logger;
     let userToken;
@@ -3213,14 +3276,14 @@ async function resolveIdentity(config, Coframe, timeoutMs, gracefulExit) {
     return { userToken, applyCookieConsent, onConsentChange };
 }
 
-async function resolveProject(Coframe, previewVariantId, config) {
+async function resolveProject(Coframe, previewVariantId, isSessionVariant, config) {
     var _a;
     const logger = Coframe.logger;
     const projectData = (_a = findLastCmd((c) => !!c.projectData)) === null || _a === void 0 ? void 0 : _a.projectData;
     let personalizationHeaders = (projectData === null || projectData === void 0 ? void 0 : projectData.personalizationHeaders) || null;
-    let project = projectData === null || projectData === void 0 ? void 0 : projectData.project;
+    let project = isSessionVariant ? undefined : projectData === null || projectData === void 0 ? void 0 : projectData.project;
     if (!project) {
-        const edgeResult = await fetchProjectFromEdge(Coframe.projectId, config.currentUrl || getCurrentPageUrl(), undefined, config.userContext);
+        const edgeResult = await fetchProjectFromEdge(Coframe.projectId, config.currentUrl || getCurrentPageUrl(), undefined, config.userContext, previewVariantId || undefined);
         personalizationHeaders = (edgeResult === null || edgeResult === void 0 ? void 0 : edgeResult.personalizationHeaders) || null;
         project = (edgeResult === null || edgeResult === void 0 ? void 0 : edgeResult.project) || undefined;
     }
@@ -3312,7 +3375,7 @@ async function init(options) {
     const configResult = await resolveConfig(Coframe, revealPage);
     if (!configResult)
         return;
-    const projectResult = await resolveProject(Coframe, configResult.previewVariantId, configResult.config);
+    const projectResult = await resolveProject(Coframe, configResult.previewVariantId, configResult.isSessionVariant, configResult.config);
     if (!projectResult)
         return;
     Coframe.orgId = projectResult.project.org_id || '';

package/dist/pkg/server.cjs.js

@@ -22,7 +22,7 @@ function sanitizeUserContext(userContext) {
     return userContext;
 }
 
-async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, headers) {
+async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, previewVariantId, headers) {
     const payload = { projectId, currentUrl };
     const safe = sanitizeUserContext(userContext);
     if (safe) {
@@ -73,7 +73,7 @@ async function getProjectData(options) {
     const includeCSS = options.includeCSS !== false;
     const [projectResult, antiflickerCSS] = await Promise.all([
         includeProject
-            ? fetchProjectFromEdge(options.projectId, options.currentUrl, undefined, options.userContext, options.headers)
+            ? fetchProjectFromEdge(options.projectId, options.currentUrl, undefined, options.userContext, undefined, options.headers)
             : Promise.resolve(null),
         includeCSS
             ? fetchAntiflickerFromEdge(options.projectId, options.currentUrl, options.userContext, options.enableElementAntiFlicker, options.headers)

package/dist/pkg/server.esm.mjs

@@ -20,7 +20,7 @@ function sanitizeUserContext(userContext) {
     return userContext;
 }
 
-async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, headers) {
+async function fetchProjectFromEdge(projectId, currentUrl, signal, userContext, previewVariantId, headers) {
     const payload = { projectId, currentUrl };
     const safe = sanitizeUserContext(userContext);
     if (safe) {
@@ -71,7 +71,7 @@ async function getProjectData(options) {
     const includeCSS = options.includeCSS !== false;
     const [projectResult, antiflickerCSS] = await Promise.all([
         includeProject
-            ? fetchProjectFromEdge(options.projectId, options.currentUrl, undefined, options.userContext, options.headers)
+            ? fetchProjectFromEdge(options.projectId, options.currentUrl, undefined, options.userContext, undefined, options.headers)
             : Promise.resolve(null),
         includeCSS
             ? fetchAntiflickerFromEdge(options.projectId, options.currentUrl, options.userContext, options.enableElementAntiFlicker, options.headers)

package/dist/pkg/types/index.d.ts

@@ -232,6 +232,7 @@ type ActivationCondition = {
 };
 type CoframeConfig = {
     projectId: string;
+    previewVariantId?: string;
     trackingOnly?: boolean;
     enableAntiFlickering?: boolean;
     enableElementAntiFlicker?: boolean;

package/dist/pkg/types/react.d.ts

@@ -235,6 +235,7 @@ type ActivationCondition = {
 };
 type CoframeConfig = {
     projectId: string;
+    previewVariantId?: string;
     trackingOnly?: boolean;
     enableAntiFlickering?: boolean;
     enableElementAntiFlicker?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coframe/sdk",
-  "version": "1.1.2",
+  "version": "1.1.4",
   "description": "Coframe optimizes your website using generative AI to deliver maximum impact to your audience and allow your site to improve itself as you sleep. Learn more at coframe.com.",
   "main": "dist/pkg/cf.cjs.js",
   "module": "dist/pkg/cf.esm.mjs",