fix(core): preserve URL backslash identity while rebasing

Author: miguel-heygen

packages/core/src/compiler/htmlBundler.test.ts

@@ -1847,6 +1847,21 @@ describe("bundleToSingleHtml", () => {
     expect(styleText(inlined)).toContain(inlinedAs("image/png", "escaped-space-image"));
   });
 
+  it("keeps raw URL backslashes distinct from encoded filename backslashes in linked CSS", async () => {
+    const dir = makeTempProject({
+      "index.html": `<link rel="stylesheet" href="css/theme.css"><div data-composition-id="root" data-width="320" data-height="180"></div>`,
+      "css/theme.css": String.raw`.raw { background: url("assets\\logo.png"); } .encoded { background: url("assets%5Clogo.png"); }`,
+      "css/assets/logo.png": "separator-image",
+      "css/assets\\logo.png": "literal-backslash-image",
+    });
+    const linked = await bundleToSingleHtml(dir, { inlineAssets: false });
+    expect(styleText(linked)).toContain('url("css/assets/logo.png")');
+    expect(styleText(linked)).toContain('url("css/assets%5Clogo.png")');
+    const inlined = await bundleToSingleHtml(dir);
+    expect(styleText(inlined)).toContain(inlinedAs("image/png", "separator-image"));
+    expect(styleText(inlined)).toContain(inlinedAs("image/png", "literal-backslash-image"));
+  });
+
   it("removes CSS line continuations before rebasing linked stylesheet URLs", async () => {
     const dir = makeTempProject({
       "index.html": `<link rel="stylesheet" href="css/theme.css"><div data-composition-id="root" data-width="320" data-height="180"></div>`,

packages/core/src/compiler/htmlBundler.ts

@@ -140,6 +140,10 @@ function withCommentsStripped<T>(
   return { result, restore };
 }
 
+function resolveRelativeUrlPath(fromDir: string, basePath: string): string {
+  return resolve(fromDir, decodeWellFormedEscapes(basePath.replaceAll("\\", "/")));
+}
+
 function rebaseCssUrls(css: string, cssFileDir: string, projectDir: string): string {
   const resolvedRoot = resolve(projectDir);
   const resolvedDir = resolve(cssFileDir);
@@ -149,7 +153,7 @@ function rebaseCssUrls(css: string, cssFileDir: string, projectDir: string): str
     if (!decoded || !isRelativeUrl(decoded)) return full;
     const { basePath, suffix } = splitUrlSuffix(decoded);
     if (!basePath) return full;
-    const absolutePath = resolve(resolvedDir, decodeWellFormedEscapes(basePath));
+    const absolutePath = resolveRelativeUrlPath(resolvedDir, basePath);
     const rebased = encodeUrlPath(relative(resolvedRoot, absolutePath).split(sep).join("/"));
     if (rebased === basePath) return full;
     const escapedSuffix = suffix.replace(
@@ -163,7 +167,7 @@ function rebaseCssUrls(css: string, cssFileDir: string, projectDir: string): str
 function rebaseRelativePath(urlValue: string, fromDir: string, toDir: string): string {
   const { basePath, suffix } = splitUrlSuffix(urlValue.trim());
   if (!basePath) return urlValue;
-  const absolutePath = resolve(fromDir, decodeWellFormedEscapes(basePath));
+  const absolutePath = resolveRelativeUrlPath(fromDir, basePath);
   const rebased = encodeUrlPath(relative(resolve(toDir), absolutePath).split(sep).join("/"));
   return appendSuffixToUrl(rebased, suffix);
 }

packages/parsers/src/utils/urlPath.ts

@@ -36,7 +36,7 @@ export function encodeUrlPath(path: string): string {
 
 export function decodeCssEscapes(text: string): string {
   return text
-    .replace(/\0/g, "\uFFFD")
+    .replaceAll("\0", "\uFFFD")
     .replace(
       /\\(?:([0-9a-f]{1,6})(?:\r\n|[ \t\r\n\f])?|(\r\n|[\n\r\f])|([\s\S]))/gi,
       (