fix(builder): css hash incorrectly transforming data urls (#2921)

Fixes #2599

Author: marvinhagemeister

src/dev/builder_test.ts

@@ -98,6 +98,35 @@ Deno.test({
   sanitizeResources: false,
 });
 
+// Issue https://github.com/denoland/fresh/issues/2599
+Deno.test({
+  name: "Builder - hashes CSS urls by default",
+  fn: async () => {
+    const builder = new Builder();
+    const tmp = await Deno.makeTempDir();
+    await Deno.writeTextFile(
+      path.join(tmp, "foo.css"),
+      `:root { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(76, 154.5, 137.5)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E"); }`,
+    );
+    const app = new App({
+      staticDir: tmp,
+      build: {
+        outDir: path.join(tmp, "dist"),
+      },
+    });
+    await builder.build(app);
+
+    const css = await Deno.readTextFile(
+      path.join(tmp, "dist", "static", "foo.css"),
+    );
+    expect(css).toEqual(
+      `:root { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(76, 154.5, 137.5)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E"); }`,
+    );
+  },
+  sanitizeOps: false,
+  sanitizeResources: false,
+});
+
 Deno.test({
   name: "Builder - can bundle islands from JSR",
   fn: async () => {

src/dev/file_transformer.ts

@@ -220,7 +220,7 @@ export class FreshFileTransformer {
   }
 }
 
-const CSS_URL_REGEX = /url\((["'][^'"]+["']|[^)]+)\)/g;
+const CSS_URL_REGEX = /url\(("[^"]+"|'[^']+'|[^)]+)\)/g;
 
 export function cssAssetHash(transformer: FreshFileTransformer) {
   transformer.onTransform({