stuff

Author: alexanderkirtzel

.changeset/cli-previews-command.md

@@ -0,0 +1,8 @@
+---
+'@walkeros/cli': minor
+---
+
+Add `walkeros previews {list|get|create|delete}` commands for managing preview
+bundles. `create` supports `--flow <name>` or `--settings-id <id>` to target a
+flow settings entry, and `--url <siteUrl>` to produce a ready-to-open activation
+URL. Use `--open` to launch it in your default browser.

.changeset/mcp-preview-actions.md

@@ -0,0 +1,7 @@
+---
+'@walkeros/mcp': minor
+---
+
+Add `preview.list`, `preview.get`, `preview.create`, and `preview.delete`
+actions to the `api` tool. When `siteUrl` is provided to `preview.create`, the
+response includes a ready-to-open `activationUrl` and `deactivationUrl`.

.changeset/preview-preflight-self-heal.md

@@ -0,0 +1,9 @@
+---
+'@walkeros/cli': minor
+---
+
+Preview preflight now self-heals when a preview bundle is deleted. Instead of
+injecting the preview script directly and letting it 404, the preflight does a
+`fetch(HEAD)` first. If the bundle is missing, it clears the `elbPreview` cookie
+and loads the production walker, so visitors never see silent analytics
+breakage.

.changeset/web-core-storage-try-catch.md

@@ -0,0 +1,9 @@
+---
+'@walkeros/web-core': patch
+---
+
+Wrap `localStorage`/`sessionStorage`/cookie operations in try/catch. Storage
+access in private browsing (Safari), sandboxed iframes, or when quota is
+exceeded throws `SecurityError`/`QuotaExceededError` — previously these crashed
+the event pipeline at the call site. Reads now return empty, writes return empty
+and do not persist, deletes are silently ignored.

packages/cli/src/__tests__/unit/bundle/preview-preflight-jsdom.test.ts

@@ -109,6 +109,9 @@ describe('Preview preflight jsdom integration', () => {
         d: unknown,
       ) => d;
       (win as unknown as Record<string, unknown>).__mockConfigData = {};
+      // Mock HEAD probe as 200 so the self-heal preflight proceeds to inject
+      (win as unknown as Record<string, unknown>).fetch = () =>
+        Promise.resolve({ ok: true, status: 200 });
 
       const script = win.document.createElement('script');
       script.textContent = extractEvaluableScript(entry);
@@ -156,6 +159,9 @@ describe('Preview preflight jsdom integration', () => {
         d: unknown,
       ) => d;
       (win as unknown as Record<string, unknown>).__mockConfigData = {};
+      // Mock HEAD probe as 200 so self-heal proceeds with injection
+      (win as unknown as Record<string, unknown>).fetch = () =>
+        Promise.resolve({ ok: true, status: 200 });
 
       const script = win.document.createElement('script');
       script.textContent = extractEvaluableScript(entry);
@@ -232,6 +238,9 @@ describe('Preview preflight jsdom integration', () => {
         d: unknown,
       ) => d;
       (win as unknown as Record<string, unknown>).__mockConfigData = {};
+      // Mock HEAD probe as 200 so self-heal proceeds with injection
+      (win as unknown as Record<string, unknown>).fetch = () =>
+        Promise.resolve({ ok: true, status: 200 });
 
       const script = win.document.createElement('script');
       script.textContent = extractEvaluableScript(entry);
@@ -256,6 +265,165 @@ describe('Preview preflight jsdom integration', () => {
     });
   });
 
+  describe('404 self-heal (missing preview bundle)', () => {
+    it('clears cookie and falls through to startFlow when HEAD returns 404', async () => {
+      const token = 'k9x2m4p7abcd';
+      const entry = generateWrapEntry('./skeleton.mjs', {
+        previewOrigin: 'cdn.walkeros.io',
+        previewScope: 'proj_abc',
+      });
+
+      // Pre-set the cookie so the cookie-valid branch is taken (no query param)
+      const dom = createDom('https://example.com/page');
+      const win = dom.window;
+      win.document.cookie = `elbPreview=${token}; path=/`;
+
+      let startFlowCalled = false;
+      (win as unknown as Record<string, unknown>).__mockStartFlow = () => {
+        startFlowCalled = true;
+        return Promise.resolve({ collector: {}, elb: () => {} });
+      };
+      (win as unknown as Record<string, unknown>).__mockWireConfig = (
+        d: unknown,
+      ) => d;
+      (win as unknown as Record<string, unknown>).__mockConfigData = {};
+
+      const fetchCalls: Array<{ url: string; method?: string }> = [];
+      (win as unknown as Record<string, unknown>).fetch = (
+        url: string,
+        init?: { method?: string },
+      ) => {
+        fetchCalls.push({ url, method: init?.method });
+        return Promise.resolve({ ok: false, status: 404 });
+      };
+
+      const script = win.document.createElement('script');
+      script.textContent = extractEvaluableScript(entry);
+      win.document.body.appendChild(script);
+
+      // Wait for async fetch + IIFE chain to settle
+      await new Promise((r) => setTimeout(r, 50));
+
+      // HEAD was issued to the preview URL
+      expect(fetchCalls.length).toBe(1);
+      expect(fetchCalls[0].method).toBe('HEAD');
+      expect(fetchCalls[0].url).toBe(
+        `https://cdn.walkeros.io/preview/proj_abc/walker.${token}.js`,
+      );
+
+      // No preview <script> injected
+      const injected = win.document.querySelectorAll('head > script[src]');
+      expect(injected.length).toBe(0);
+
+      // Cookie cleared (max-age=0 effectively removes it)
+      expect(win.document.cookie).not.toContain(`elbPreview=${token}`);
+
+      // Production path runs (fall-through to startFlow)
+      expect(startFlowCalled).toBe(true);
+
+      win.close();
+    });
+
+    it('clears cookie and falls through to startFlow when fetch rejects (network error)', async () => {
+      const token = 'Ab3Df5Gh7j9L';
+      const entry = generateWrapEntry('./skeleton.mjs', {
+        previewOrigin: 'cdn.walkeros.io',
+        previewScope: 'proj_abc',
+      });
+
+      const dom = createDom('https://example.com/page');
+      const win = dom.window;
+      win.document.cookie = `elbPreview=${token}; path=/`;
+
+      let startFlowCalled = false;
+      (win as unknown as Record<string, unknown>).__mockStartFlow = () => {
+        startFlowCalled = true;
+        return Promise.resolve({ collector: {}, elb: () => {} });
+      };
+      (win as unknown as Record<string, unknown>).__mockWireConfig = (
+        d: unknown,
+      ) => d;
+      (win as unknown as Record<string, unknown>).__mockConfigData = {};
+
+      (win as unknown as Record<string, unknown>).fetch = () =>
+        Promise.reject(new Error('network failure'));
+
+      const script = win.document.createElement('script');
+      script.textContent = extractEvaluableScript(entry);
+      win.document.body.appendChild(script);
+
+      await new Promise((r) => setTimeout(r, 50));
+
+      // No preview <script> injected
+      const injected = win.document.querySelectorAll('head > script[src]');
+      expect(injected.length).toBe(0);
+
+      // Cookie cleared
+      expect(win.document.cookie).not.toContain(`elbPreview=${token}`);
+
+      // Production path runs (fall-through to startFlow)
+      expect(startFlowCalled).toBe(true);
+
+      win.close();
+    });
+
+    it('injects preview script and skips startFlow when HEAD returns 200', async () => {
+      const token = 'k9x2m4p7abcd';
+      const entry = generateWrapEntry('./skeleton.mjs', {
+        previewOrigin: 'cdn.walkeros.io',
+        previewScope: 'proj_abc',
+      });
+
+      const dom = createDom('https://example.com/page');
+      const win = dom.window;
+      win.document.cookie = `elbPreview=${token}; path=/`;
+
+      let startFlowCalled = false;
+      (win as unknown as Record<string, unknown>).__mockStartFlow = () => {
+        startFlowCalled = true;
+        return Promise.resolve({ collector: {}, elb: () => {} });
+      };
+      (win as unknown as Record<string, unknown>).__mockWireConfig = (
+        d: unknown,
+      ) => d;
+      (win as unknown as Record<string, unknown>).__mockConfigData = {};
+
+      const fetchCalls: Array<{ url: string; method?: string }> = [];
+      (win as unknown as Record<string, unknown>).fetch = (
+        url: string,
+        init?: { method?: string },
+      ) => {
+        fetchCalls.push({ url, method: init?.method });
+        return Promise.resolve({ ok: true, status: 200 });
+      };
+
+      const script = win.document.createElement('script');
+      script.textContent = extractEvaluableScript(entry);
+      win.document.body.appendChild(script);
+
+      await new Promise((r) => setTimeout(r, 50));
+
+      // HEAD probe fired
+      expect(fetchCalls.length).toBe(1);
+      expect(fetchCalls[0].method).toBe('HEAD');
+
+      // Preview script injected
+      const injected = win.document.querySelectorAll('head > script[src]');
+      expect(injected.length).toBe(1);
+      expect((injected[0] as HTMLScriptElement).src).toBe(
+        `https://cdn.walkeros.io/preview/proj_abc/walker.${token}.js`,
+      );
+
+      // Cookie preserved
+      expect(win.document.cookie).toContain(`elbPreview=${token}`);
+
+      // startFlow NOT called (preview took over)
+      expect(startFlowCalled).toBe(false);
+
+      win.close();
+    });
+  });
+
   describe('regression: no preflight without preview options', () => {
     it('does NOT inject any preflight code when no preview options', async () => {
       const entry = generateWrapEntry('./skeleton.mjs', {

packages/cli/src/cli.ts

@@ -37,6 +37,7 @@ import {
   getDeploymentBySlugCommand,
 } from './commands/deployments/index.js';
 import { feedbackCommand } from './commands/feedback/index.js';
+import { writeResult } from './core/output.js';
 
 setClientContext({ type: 'cli', version: VERSION });
 
@@ -445,6 +446,96 @@ deployCmd
     await deleteDeploymentCommand(idOrSlug, options);
   });
 
+// ── Previews ─────────────────────────────────────────────────────────────
+const previewsCmd = program
+  .command('previews')
+  .description('Manage preview bundles for testing flow changes on live sites');
+
+previewsCmd
+  .command('list <flowId>')
+  .description('List previews for a flow')
+  .option('--project <projectId>', 'Project ID (overrides default)')
+  .action(async (flowId, options) => {
+    try {
+      const { listPreviews } = await import('./commands/previews/index.js');
+      const result = (await listPreviews({
+        projectId: options.project,
+        flowId,
+      })) as { previews: unknown };
+      await writeResult(JSON.stringify(result.previews, null, 2), {});
+    } catch (err) {
+      handleCliError(err);
+    }
+  });
+
+previewsCmd
+  .command('get <flowId> <previewId>')
+  .description('Get preview details')
+  .option('--project <projectId>', 'Project ID (overrides default)')
+  .action(async (flowId, previewId, options) => {
+    try {
+      const { getPreview } = await import('./commands/previews/index.js');
+      const result = await getPreview({
+        projectId: options.project,
+        flowId,
+        previewId,
+      });
+      await writeResult(JSON.stringify(result, null, 2), {});
+    } catch (err) {
+      handleCliError(err);
+    }
+  });
+
+previewsCmd
+  .command('create <flowId>')
+  .description('Create a preview bundle for a flow settings entry')
+  .option('-f, --flow <name>', 'Flow settings name (resolved to ID)')
+  .option('-s, --settings-id <id>', 'Flow settings ID (alternative to --flow)')
+  .option('-u, --url <url>', 'Site URL to construct activation URL')
+  .option('--open', 'Open activation URL in the default browser')
+  .option('--project <projectId>', 'Project ID (overrides default)')
+  .action(async (flowId, options) => {
+    try {
+      const { createPreview } = await import('./commands/previews/index.js');
+      const { printPreviewCreated } =
+        await import('./commands/previews/output.js');
+      const preview = (await createPreview({
+        projectId: options.project,
+        flowId,
+        flowName: options.flow,
+        flowSettingsId: options.settingsId,
+      })) as Parameters<typeof printPreviewCreated>[0];
+      await printPreviewCreated(preview, {
+        url: options.url,
+        open: options.open,
+      });
+    } catch (err) {
+      handleCliError(err);
+    }
+  });
+
+previewsCmd
+  .command('delete <flowId> <previewId>')
+  .description('Delete a preview')
+  .option('-y, --yes', 'Skip confirmation prompt')
+  .option('--project <projectId>', 'Project ID (overrides default)')
+  .action(async (flowId, previewId, options) => {
+    try {
+      if (!options.yes) {
+        throw new Error('Confirmation required. Use --yes to skip.');
+      }
+      const { deletePreview } = await import('./commands/previews/index.js');
+      await deletePreview({
+        projectId: options.project,
+        flowId,
+        previewId,
+      });
+      process.stderr.write(`Deleted ${previewId}\n`);
+    } catch (err) {
+      handleCliError(err);
+    }
+  });
+
 // Run command
 program
   .command('run [file]')

packages/cli/src/commands/bundle/bundler.ts

@@ -1757,10 +1757,25 @@ export function generateWrapEntry(
     var __match = /(?:^|; )elbPreview=([^;]+)/.exec(document.cookie);
     var __token = __match && __match[1];
     if (__token && /^[a-zA-Z0-9_-]{8,32}$/.test(__token)) {
-      var __s = document.createElement('script');
-      __s.src = 'https://' + __previewOrigin + '/preview/' + __previewScope + '/walker.' + __token + '.js';
-      document.head.appendChild(__s);
-      return;
+      var __previewSrc = 'https://' + __previewOrigin + '/preview/' + __previewScope + '/walker.' + __token + '.js';
+      var __clearPreviewCookie = function () {
+        document.cookie = 'elbPreview=; path=/; max-age=0; SameSite=Lax' + __secure;
+      };
+      try {
+        var __probe = await fetch(__previewSrc, { method: 'HEAD' });
+        if (__probe && __probe.ok) {
+          var __s = document.createElement('script');
+          __s.src = __previewSrc;
+          document.head.appendChild(__s);
+          return;
+        }
+        // Preview bundle missing (404/5xx) — self-heal by clearing cookie and
+        // falling through to the production walker in this same bundle.
+        __clearPreviewCookie();
+      } catch (__err) {
+        // Network error — fall through to production too.
+        __clearPreviewCookie();
+      }
     }
   }
   // --- End preview mode preflight ---