@tokenoftrust/storefront-runner 2.4.71 → 2.4.72

package/apps/storefront/src/lib/content/sanitizeDescriptionHtml.ts

@@ -0,0 +1,67 @@
+/**
+ * Dependency-free, render-time sanitizer for catalog `description_html` (collections
+ * today; the same function covers products). The repo ships no runtime HTML-parsing
+ * library (see the "no new deps" convention and `blog/markdown.ts`'s own note that
+ * `sanitize-html` is a node-only devtool used by the migration pipeline), so this is
+ * a defense-in-depth pass that runs where the content is actually rendered with
+ * `set:html` — on top of, not instead of, the migration pipeline's own
+ * `sanitizeHtml(...)` pass at ingestion (`packages/migration/src/transform/transform.ts`).
+ *
+ * Scope matches `findUnsafeHtml`'s refusal list
+ * (`packages/private-controlplane/src/customization-richcontent.ts`): strip
+ * `<script>`/`<style>` elements entirely (tag + content), strip `<iframe>`/
+ * `<object>`/`<embed>` entirely, strip every `on*` event-handler attribute, and
+ * neutralize `javascript:`/`vbscript:`/`data:` URLs in `href`/`src`/`action`. Any
+ * other tag/attribute passes through unchanged — the allowed-tag narrowing already
+ * happened upstream in the migration transform.
+ *
+ * Returns "" for null/blank input so callers can render no block at all rather than
+ * an empty one.
+ */
+
+const DANGEROUS_ELEMENTS = ["script", "style", "iframe", "object", "embed"];
+
+function stripDangerousElements(html: string): string {
+  let out = html;
+  for (const tag of DANGEROUS_ELEMENTS) {
+    // Paired form: <script ...>...</script> (content dropped too — never just
+    // unwrapped, since the content of a <script>/<style> is not markup).
+    out = out.replace(new RegExp(`<${tag}\\b[^>]*>[\\s\\S]*?<\\/${tag}\\s*>`, "gi"), "");
+    // Self-closing / unpaired form: a stray <iframe src="..."> with no closing tag.
+    out = out.replace(new RegExp(`<${tag}\\b[^>]*\\/?>`, "gi"), "");
+  }
+  return out;
+}
+
+/** Strips any `on<event>="..."`/`on<event>='...'`/`on<event>=bare` attribute from every tag. */
+function stripEventHandlerAttributes(html: string): string {
+  return html.replace(
+    /\son[a-z]+\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+)/gi,
+    "",
+  );
+}
+
+/** Rewrites a `javascript:`/`vbscript:`/`data:` URL in href/src/action to "about:blank#blocked". */
+function neutralizeScriptUrls(html: string): string {
+  return html.replace(
+    /\b(href|src|action)(\s*=\s*)("|')\s*(?:javascript|vbscript|data):[^"'>]*\3/gi,
+    (_m, attr: string, eq: string, quote: string) => `${attr}${eq}${quote}about:blank#blocked${quote}`,
+  );
+}
+
+/**
+ * Sanitize already-HTML-sanitized catalog `description_html` for render-time
+ * defense-in-depth. Idempotent and pure. Returns "" for null/undefined/blank input.
+ */
+export function sanitizeDescriptionHtml(html: string | null | undefined): string {
+  if (!html) return "";
+  const trimmed = html.trim();
+  if (!trimmed) return "";
+  const cleaned = neutralizeScriptUrls(stripEventHandlerAttributes(stripDangerousElements(trimmed))).trim();
+  return cleaned;
+}
+
+/** True when sanitized output has no renderable content (e.g. input was only tags/whitespace). */
+export function isBlankDescriptionHtml(sanitized: string): boolean {
+  return sanitized.replace(/<[^>]+>/g, "").trim().length === 0;
+}

package/apps/storefront/src/pages/collections/[handle].astro

@@ -19,6 +19,7 @@ import { parseQuery, buildQueryString } from "@/lib/url";
 import { breadcrumbLd, itemListLd } from "@/lib/jsonld";
 import { truncate } from "@/lib/format";
 import { withBase } from "@/lib/basePath";
+import { isBlankDescriptionHtml, sanitizeDescriptionHtml } from "@/lib/content/sanitizeDescriptionHtml";
 
 const { handle } = Astro.params;
 const { tenant, tot, canonicalBase } = Astro.locals;
@@ -56,6 +57,13 @@ const crumbs = siteTrail(
 
 const heroImg = collection.image;
 const desc = collection.description_text || collection.description_html?.replace(/<[^>]+>/g, "");
+// Full-fidelity body (brands/how-it-works/ingredients/FAQ sections on the merchant's
+// live collection pages), sanitized for render-time defense-in-depth on top of the
+// migration pipeline's own sanitize-html pass at ingestion (see
+// sanitizeDescriptionHtml.ts). Rendered as its own block BELOW the product grid,
+// matching the live site's layout — `desc` above stays the short hero excerpt.
+const contentBlockHtml = sanitizeDescriptionHtml(collection.description_html);
+const hasContentBlock = contentBlockHtml.length > 0 && !isBlankDescriptionHtml(contentBlockHtml);
 
 // Zero-results recovery: differentiate the cause (search term vs. facet/price
 // filters) and offer targeted "undo just this" links alongside the existing
@@ -183,4 +191,10 @@ if (query.priceMin != null || query.priceMax != null) {
       )}
     </div>
   </div>
+
+  {hasContentBlock && (
+    <section class="container-prose pb-16">
+      <div class="rte mx-auto max-w-[68ch] text-[var(--color-text)]" set:html={contentBlockHtml} />
+    </section>
+  )}
 </Layout>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tokenoftrust/storefront-runner",
-  "version": "2.4.71",
+  "version": "2.4.72",
   "license": "SEE LICENSE IN LICENSE",
   "description": "World-shareable storefront runner: multi-tenant renderer on Astro/Cloudflare. No control plane.",
   "packageManager": "pnpm@11.9.0",