From 3fa7943344fac8ce198ab0867d6e21b4d4b892ac Mon Sep 17 00:00:00 2001
From: Lucas Ozdemir <97968626+LuBoys@users.noreply.github.com>
Date: Thu, 23 Jul 2026 13:32:06 +0200
Subject: [PATCH] :bug: Allow SVG files for image fills (#10771)

Use Penpot's shared image type list for image fill uploads and add an integration test covering SVG file selection.

AI-assisted-by: gpt-5.6-sol

Signed-off-by: Lucas Ozdemir <lulu.58@outlook.fr>
Co-authored-by: Andrey Antukh <niwi@niwi.nz>
---
 .../playwright/ui/specs/colorpicker.spec.js   | 29 +++++++++++++++++++
 .../app/main/ui/workspace/colorpicker.cljs    |  2 +-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/frontend/playwright/ui/specs/colorpicker.spec.js b/frontend/playwright/ui/specs/colorpicker.spec.js
index cc772aa3a3..ee9dbcd770 100644
--- a/frontend/playwright/ui/specs/colorpicker.spec.js
+++ b/frontend/playwright/ui/specs/colorpicker.spec.js
@@ -24,6 +24,35 @@ test("Bug 7549 - User clicks on color swatch to display the color picker next to
   expect(distance).toBeLessThan(60);
 });
 
+test("Bug 10756 - Image fill picker accepts SVG files", async ({ page }) => {
+  const workspacePage = new WasmWorkspacePage(page);
+  await workspacePage.setupEmptyFile();
+  await workspacePage.mockRPC(
+    /get\-file\?/,
+    "workspace/get-file-not-empty.json",
+  );
+  await workspacePage.mockRPC(
+    "update-file?id=*",
+    "workspace/update-file-create-rect.json",
+  );
+
+  await workspacePage.goToWorkspace({
+    fileId: "6191cd35-bb1f-81f7-8004-7cc63d087374",
+    pageId: "6191cd35-bb1f-81f7-8004-7cc63d087375",
+  });
+  await workspacePage.clickLeafLayer("Rectangle");
+  await workspacePage.page
+    .getByRole("button", { name: "#B1B2B5" })
+    .click();
+  await workspacePage.page.getByText("Solid").click();
+  await workspacePage.page.getByText("Image").click();
+
+  await expect(workspacePage.page.locator("#fill-image-upload")).toHaveAttribute(
+    "accept",
+    /(?:^|,)image\/svg\+xml(?:,|$)/,
+  );
+});
+
 test("Create a LINEAR gradient", async ({ page }) => {
   const workspacePage = new WasmWorkspacePage(page);
   await workspacePage.setupEmptyFile();
diff --git a/frontend/src/app/main/ui/workspace/colorpicker.cljs b/frontend/src/app/main/ui/workspace/colorpicker.cljs
index e749dd259b..de586da6d8 100644
--- a/frontend/src/app/main/ui/workspace/colorpicker.cljs
+++ b/frontend/src/app/main/ui/workspace/colorpicker.cljs
@@ -489,7 +489,7 @@
                (tr "media.choose-image")
                [:& file-uploader
                 {:input-id "fill-image-upload"
-                 :accept "image/jpeg,image/png"
+                 :accept dwm/accept-image-types
                  :multi false
                  :ref fill-image-ref
                  :on-selected on-fill-image-selected}]]])