fix: upload unoptimized inception images (#5419)

This fixes the issue with uploading avif which is not supported as image
source.

Author: TrySound

apps/builder/app/shared/copy-paste/asset-upload.test.tsx

@@ -1,4 +1,4 @@
-import { expect, test } from "vitest";
+import { expect, test, vi } from "vitest";
 import { $, AssetValue, renderTemplate } from "@webstudio-is/template";
 import type { StyleDecl, WebstudioFragment } from "@webstudio-is/sdk";
 import { denormalizeSrcProps } from "./asset-upload";
@@ -128,3 +128,25 @@ test("it works well with no background-images", async () => {
 
   expect(denormalizedAssetIds).toEqual(inputUrls.map(src2AssetId));
 });
+
+test("upload raw inception images", async () => {
+  const data = renderTemplate(
+    <$.Body ws:id="boxA">
+      <$.Image
+        ws:id="imageA"
+        src="https://preview.webstudio.ai/cgi/image/dev/5036ed5c3dfce99eaac566a06bc3729620354a364357907a523f1feb2d6fb819.png?width=1024&height=1024&format=auto"
+      ></$.Image>
+    </$.Body>
+  );
+  const uploadImages = vi.fn(async (srcs: string[]) => {
+    return new Map(srcs.map((src) => [src, src]));
+  });
+  await denormalizeSrcProps(
+    data,
+    uploadImages,
+    (instanceId, propName) => `${instanceId}:${propName}`
+  );
+  expect(uploadImages).toBeCalledWith([
+    "https://preview.webstudio.ai/cgi/image/dev/5036ed5c3dfce99eaac566a06bc3729620354a364357907a523f1feb2d6fb819.png?format=raw",
+  ]);
+});

apps/builder/app/shared/copy-paste/asset-upload.ts

@@ -24,7 +24,13 @@ const extractSrcProps = (
       imageComponentsSet.has(prop.instanceId)
     ) {
       try {
-        srcProps.push([prop.id, new URL(prop.value).href]);
+        const url = new URL(prop.value);
+        // upload raw images from inception
+        if (url.hostname === "preview.webstudio.ai") {
+          url.search = "";
+          url.searchParams.set("format", "raw");
+        }
+        srcProps.push([prop.id, url.href]);
       } catch {
         // ignore when invalid url
       }