From fea8fba54cb9afc2d619fa6960e239d3d5d9131c Mon Sep 17 00:00:00 2001 From: Vance Ingalls Date: Thu, 6 Aug 2026 13:26:27 -0700 Subject: [PATCH] fix(core): escape `<` in compiler-emitted composition variable CSS MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Composition variable values are emitted as CSS declarations inside a `` therefore terminated the stylesheet and the remainder was parsed as markup. Escape `<` to `\\3c ` in `compositionVariablesCssBlock`. That is the CSS escape for `<`, valid in every value position — including inside an unquoted `url()`, whose grammar permits escape sequences — so rendering is unchanged. Variable ids need no equivalent: `cssVariableName` slugifies them. Co-Authored-By: Claude Fable 5 --- .../core/src/compiler/htmlBundler.test.ts | 40 ++++++++++++++++++- packages/core/src/compiler/htmlBundler.ts | 23 ++++++++++- 2 files changed, 61 insertions(+), 2 deletions(-) diff --git a/packages/core/src/compiler/htmlBundler.test.ts b/packages/core/src/compiler/htmlBundler.test.ts index b820d536fa..4c3e645b33 100644 --- a/packages/core/src/compiler/htmlBundler.test.ts +++ b/packages/core/src/compiler/htmlBundler.test.ts @@ -4,7 +4,7 @@ import { tmpdir } from "node:os"; import { join } from "node:path"; import { parseHTML } from "linkedom"; import { describe, it, expect, vi } from "vitest"; -import { bundleToSingleHtml } from "./htmlBundler"; +import { bundleToSingleHtml, emitRootCompositionVariableStyles } from "./htmlBundler"; import { getHyperframeRuntimeScript } from "../generated/runtime-inline"; function makeTempProject(files: Record): string { @@ -1388,3 +1388,41 @@ describe("bundleToSingleHtml", () => { } }); }); + +/** + * Composition variable values are emitted as CSS declarations inside a `