@decocms/tanstack 7.20.9 → 7.21.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decocms/tanstack",
-  "version": "7.20.9",
+  "version": "7.21.0",
   "type": "module",
   "description": "Deco framework binding for TanStack Start + Cloudflare Workers",
   "repository": {
@@ -24,9 +24,9 @@
     "lint:unused": "knip"
   },
   "dependencies": {
-    "@decocms/blocks": "7.20.9",
-    "@decocms/blocks-admin": "7.20.9",
-    "@decocms/blocks-cli": "7.20.9",
+    "@decocms/blocks": "7.21.0",
+    "@decocms/blocks-admin": "7.21.0",
+    "@decocms/blocks-cli": "7.21.0",
     "@deco-cx/warp-node": "^0.3.16",
     "fast-json-patch": "^3.1.0",
     "ws": "^8.18.0"

package/src/sdk/workerEntry.test.ts

@@ -1,10 +1,21 @@
 import { setBlocks } from "@decocms/blocks/cms";
 import { afterEach, describe, expect, it } from "vitest";
-import { buildGeoCacheParam, createDecoWorkerEntry, detectLocationMatcher, injectGeoCookies } from "./workerEntry";
+import {
+  buildGeoCacheParam,
+  createDecoWorkerEntry,
+  DECO_ADMIN_FRAME_ANCESTORS,
+  DEFAULT_FRAME_ANCESTORS_CSP,
+  DEFAULT_SECURITY_HEADERS,
+  detectLocationMatcher,
+  injectGeoCookies,
+} from "./workerEntry";
 import { __resetKvHydrationStateForTests } from "./kvHydration";
 
 const EMPTY_ENV = {};
-const MOCK_CTX = { waitUntil: (_p: Promise<unknown>) => {} };
+const MOCK_CTX = {
+  waitUntil: (_p: Promise<unknown>) => {},
+  passThroughOnException: () => {},
+};
 const MOCK_SERVER_ENTRY = {
   fetch: async (_req: Request) => new Response("page content", { status: 200 }),
 };
@@ -313,3 +324,109 @@ describe("CMS redirects", () => {
     expect(res2.headers.get("Location")).toBe("/v2");
   });
 });
+
+describe("security headers — frame-ancestors default", () => {
+  afterEach(() => {
+    __resetKvHydrationStateForTests();
+    setBlocks({});
+  });
+
+  const HTML_SERVER_ENTRY = {
+    fetch: async (_req: Request) =>
+      new Response("<html>hi</html>", {
+        status: 200,
+        headers: { "content-type": "text/html; charset=utf-8" },
+      }),
+  };
+
+  it("does NOT ship X-Frame-Options (frame-ancestors supersedes it)", () => {
+    expect(DEFAULT_SECURITY_HEADERS["X-Frame-Options"]).toBeUndefined();
+  });
+
+  it("allows the deco studio to embed the storefront by default", () => {
+    expect(DEFAULT_FRAME_ANCESTORS_CSP).toContain("frame-ancestors");
+    expect(DECO_ADMIN_FRAME_ANCESTORS).toContain("https://studio.decocms.com");
+    expect(DECO_ADMIN_FRAME_ANCESTORS).toContain("https://*.deco.studio");
+    expect(DECO_ADMIN_FRAME_ANCESTORS).toContain("'self'");
+  });
+
+  it("applies the default frame-ancestors CSP on HTML responses and drops X-Frame-Options", async () => {
+    const worker = createDecoWorkerEntry(HTML_SERVER_ENTRY);
+    const res = await worker.fetch(new Request("https://example.com/"), EMPTY_ENV, MOCK_CTX);
+    expect(res.headers.get("Content-Security-Policy")).toBe(DEFAULT_FRAME_ANCESTORS_CSP);
+    expect(res.headers.get("X-Frame-Options")).toBeNull();
+    // Other defaults are still present.
+    expect(res.headers.get("X-Content-Type-Options")).toBe("nosniff");
+  });
+
+  it("lets a site override the frame-ancestors CSP via securityHeaders", async () => {
+    const worker = createDecoWorkerEntry(HTML_SERVER_ENTRY, {
+      securityHeaders: { "Content-Security-Policy": "frame-ancestors 'none'" },
+    });
+    const res = await worker.fetch(new Request("https://example.com/"), EMPTY_ENV, MOCK_CTX);
+    expect(res.headers.get("Content-Security-Policy")).toBe("frame-ancestors 'none'");
+  });
+
+  it("emits the full site CSP report-only alongside the enforced frame-ancestors", async () => {
+    const worker = createDecoWorkerEntry(HTML_SERVER_ENTRY, {
+      csp: ["default-src 'self'", "img-src 'self' https:"],
+    });
+    const res = await worker.fetch(new Request("https://example.com/"), EMPTY_ENV, MOCK_CTX);
+    expect(res.headers.get("Content-Security-Policy")).toBe(DEFAULT_FRAME_ANCESTORS_CSP);
+    expect(res.headers.get("Content-Security-Policy-Report-Only")).toBe(
+      "default-src 'self'; img-src 'self' https:",
+    );
+  });
+
+  it("omits all security headers when securityHeaders is false", async () => {
+    const worker = createDecoWorkerEntry(HTML_SERVER_ENTRY, { securityHeaders: false });
+    const res = await worker.fetch(new Request("https://example.com/"), EMPTY_ENV, MOCK_CTX);
+    expect(res.headers.get("Content-Security-Policy")).toBeNull();
+    expect(res.headers.get("X-Content-Type-Options")).toBeNull();
+  });
+});
+
+describe("POST /_cache/purge-loaders", () => {
+  afterEach(() => {
+    __resetKvHydrationStateForTests();
+    setBlocks({});
+  });
+
+  const purge = (env: Record<string, unknown>, headers: Record<string, string> = {}) => {
+    const worker = createDecoWorkerEntry(MOCK_SERVER_ENTRY, { observability: false });
+    return worker.fetch(
+      new Request("https://example.com/_cache/purge-loaders", { method: "POST", headers }),
+      env,
+      MOCK_CTX,
+    );
+  };
+
+  it("401s without a valid Bearer token", async () => {
+    const res = await purge({ PURGE_TOKEN: "secret" });
+    expect(res.status).toBe(401);
+  });
+
+  it("401s with the wrong token", async () => {
+    const res = await purge({ PURGE_TOKEN: "secret" }, { Authorization: "Bearer nope" });
+    expect(res.status).toBe(401);
+  });
+
+  it("clears the loader cache with a valid token", async () => {
+    const res = await purge({ PURGE_TOKEN: "secret" }, { Authorization: "Bearer secret" });
+    expect(res.status).toBe(200);
+    expect(await res.json()).toEqual({ cleared: true, scope: "isolate" });
+  });
+
+  it("404s when purge is disabled (purgeTokenEnv: false)", async () => {
+    const worker = createDecoWorkerEntry(MOCK_SERVER_ENTRY, {
+      observability: false,
+      purgeTokenEnv: false,
+    });
+    const res = await worker.fetch(
+      new Request("https://example.com/_cache/purge-loaders", { method: "POST" }),
+      EMPTY_ENV,
+      MOCK_CTX,
+    );
+    expect(res.status).toBe(404);
+  });
+});

package/src/sdk/workerEntry.ts

@@ -38,6 +38,7 @@ import {
   runSingleSectionLoader,
 } from "@decocms/blocks/cms";
 import { DECO_MATCHERS_OVERRIDE_PARAM } from "@decocms/blocks/matchers/override";
+import { clearLoaderCache } from "@decocms/blocks/sdk/cachedLoader";
 import { loadRedirects, matchRedirect, type RedirectMap } from "@decocms/blocks/sdk/redirects";
 import {
   type CacheProfileName,
@@ -331,10 +332,13 @@ export interface DecoWorkerEntryOptions {
    * Security headers appended to every SSR response (HTML pages).
    * Pass `false` to disable entirely.
    *
-   * Default headers: X-Content-Type-Options, X-Frame-Options, Referrer-Policy,
-   * Permissions-Policy, X-XSS-Protection, HSTS, Cross-Origin-Opener-Policy.
+   * Default headers: X-Content-Type-Options, Referrer-Policy,
+   * Permissions-Policy, X-XSS-Protection, HSTS, Cross-Origin-Opener-Policy,
+   * and a `Content-Security-Policy: frame-ancestors` directive that lets the
+   * deco admin/studio embed the storefront (see DEFAULT_FRAME_ANCESTORS_CSP).
    *
-   * Custom entries are merged with defaults (custom values take precedence).
+   * Custom entries are merged with defaults (custom values take precedence) —
+   * pass `Content-Security-Policy` here to override the default frame-ancestors.
    *
    * @default DEFAULT_SECURITY_HEADERS
    */
@@ -621,11 +625,19 @@ const ONE_YEAR = 31536000;
 
 /**
  * Sensible security headers for any production storefront.
- * CSP is intentionally not included — it's site-specific (third-party script domains).
+ *
+ * Framing protection is handled by a default `Content-Security-Policy:
+ * frame-ancestors` directive (see DEFAULT_FRAME_ANCESTORS_CSP), NOT
+ * `X-Frame-Options`. CSP level 3 `frame-ancestors` supersedes X-Frame-Options
+ * in every modern browser, and — unlike the all-or-nothing SAMEORIGIN value —
+ * it can allow the deco admin/studio to embed the storefront for live preview
+ * while still blocking arbitrary third-party framing (clickjacking).
+ *
+ * Full CSP (script-src etc.) is intentionally not included here — it's
+ * site-specific (third-party script domains) and passed via the `csp` option.
  */
 export const DEFAULT_SECURITY_HEADERS: Record<string, string> = {
   "X-Content-Type-Options": "nosniff",
-  "X-Frame-Options": "SAMEORIGIN",
   "Referrer-Policy": "strict-origin-when-cross-origin",
   "Permissions-Policy": "camera=(), microphone=(), geolocation=()",
   "X-XSS-Protection": "1; mode=block",
@@ -633,6 +645,28 @@ export const DEFAULT_SECURITY_HEADERS: Record<string, string> = {
   "Cross-Origin-Opener-Policy": "same-origin-allow-popups",
 };
 
+/**
+ * Origins allowed to embed the storefront in an iframe. These are the deco
+ * studio surfaces that render the live-preview iframe, plus `'self'` so the
+ * storefront can frame itself.
+ *
+ * A site can widen this by passing its own
+ * `securityHeaders["Content-Security-Policy"]`, or drop framing protection
+ * entirely with `securityHeaders: false`.
+ */
+export const DECO_ADMIN_FRAME_ANCESTORS: string[] = [
+  "'self'",
+  "https://studio.decocms.com",
+  "https://*.deco.studio",
+];
+
+/**
+ * Default enforcement CSP shipped on every SSR HTML response. Only the
+ * `frame-ancestors` directive is enforced by default; the full site CSP
+ * (passed via the `csp` option) is emitted report-only.
+ */
+export const DEFAULT_FRAME_ANCESTORS_CSP = `frame-ancestors ${DECO_ADMIN_FRAME_ANCESTORS.join(" ")}`;
+
 const DEFAULT_BYPASS_PATHS = ["/_build", "/deco/", "/live/", "/.decofile"];
 
 /**
@@ -879,6 +913,12 @@ export function createDecoWorkerEntry(
   const secHeaders: Record<string, string> | null = (() => {
     if (securityHeadersOpt === false) return null;
     const base = { ...DEFAULT_SECURITY_HEADERS };
+    // Ship an enforcement `frame-ancestors` CSP by default so the deco
+    // admin/studio can embed the storefront for live preview without every
+    // site copy-pasting the directive into its worker entry. A site can
+    // override the whole header via securityHeaders["Content-Security-Policy"]
+    // (the merge loop below wins) or disable all security headers with `false`.
+    base["Content-Security-Policy"] = DEFAULT_FRAME_ANCESTORS_CSP;
     if (securityHeadersOpt) {
       for (const [k, v] of Object.entries(securityHeadersOpt)) base[k] = v;
     }
@@ -1113,15 +1153,33 @@ export function createDecoWorkerEntry(
     return segments;
   }
 
-  async function handlePurge(request: Request, env: Record<string, unknown>): Promise<Response> {
+  // Constant-time string compare — avoids a byte-wise timing side-channel on the
+  // purge token. Length is not secret here, so a fast length-mismatch reject is fine.
+  function timingSafeEqualStr(a: string, b: string): boolean {
+    if (a.length !== b.length) return false;
+    let diff = 0;
+    for (let i = 0; i < a.length; i++) diff |= a.charCodeAt(i) ^ b.charCodeAt(i);
+    return diff === 0;
+  }
+
+  // Shared auth for the cache purge endpoints. Returns a Response when the request
+  // is unauthorized or purge is disabled, or null when authorized. Single source
+  // of truth so /_cache/purge and /_cache/purge-loaders can't drift.
+  function authorizePurge(request: Request, env: Record<string, unknown>): Response | null {
     if (purgeTokenEnv === false) {
       return new Response("Purge disabled", { status: 404 });
     }
-
     const token = (env[purgeTokenEnv] as string) || "";
-    if (!token || request.headers.get("Authorization") !== `Bearer ${token}`) {
+    const auth = request.headers.get("Authorization") ?? "";
+    if (!token || !timingSafeEqualStr(auth, `Bearer ${token}`)) {
       return new Response("Unauthorized", { status: 401 });
     }
+    return null;
+  }
+
+  async function handlePurge(request: Request, env: Record<string, unknown>): Promise<Response> {
+    const denied = authorizePurge(request, env);
+    if (denied) return denied;
 
     let body: PurgeRequestBody;
     try {
@@ -1229,6 +1287,21 @@ export function createDecoWorkerEntry(
     return Response.json({ purged, total: purged.length });
   }
 
+  // Purge the in-memory loader/commerce cache for THIS isolate. Same auth as
+  // handlePurge (Bearer `purgeTokenEnv`). Per-isolate by nature — the isolate
+  // that serves this request clears its cache; other live isolates keep theirs
+  // until they're recycled or hit too. For a guaranteed global flush, redeploy
+  // (loader cache keys are build-hash versioned).
+  async function handlePurgeLoaders(
+    request: Request,
+    env: Record<string, unknown>,
+  ): Promise<Response> {
+    const denied = authorizePurge(request, env);
+    if (denied) return denied;
+    clearLoaderCache();
+    return Response.json({ cleared: true, scope: "isolate" });
+  }
+
   // -- Admin route handler ---------------------------------------------------
 
   const ADMIN_NO_CACHE: Record<string, string> = {
@@ -1554,6 +1627,14 @@ export function createDecoWorkerEntry(
       return handlePurge(request, env);
     }
 
+    // Loader/commerce cache purge (in-memory, this isolate only). Escape hatch
+    // to invalidate loader results immediately after an out-of-band upstream
+    // change (e.g. a Magento catalog sync) without waiting out the TTL. A
+    // redeploy is the global lever — loader cache keys are build-hash versioned.
+    if (url.pathname === "/_cache/purge-loaders" && request.method === "POST") {
+      return handlePurgeLoaders(request, env);
+    }
+
     // CMS redirects (website/loaders/redirect.ts blocks) — checked before
     // ?asJson and commerce proxy so every request path respects redirects.
     // Revision-keyed so cross-bundle setBlocks() calls are detected even when