From 24691ccb1ee3bed293fa771b9a81ccc3042e7094 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E4=B8=AB=E8=AE=B2=E6=A2=B5?= <eryajf@163.com>
Date: Fri, 31 Jul 2026 16:23:40 +0800
Subject: [PATCH] fix(desktop): stabilize update download button width

---
 .../src/components/layout/UpdateDialog.spec.ts      | 13 +++++++++++++
 apps/desktop/src/components/layout/UpdateDialog.vue |  2 +-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/apps/desktop/src/components/layout/UpdateDialog.spec.ts b/apps/desktop/src/components/layout/UpdateDialog.spec.ts
index f8a0d8c5c..d6499c860 100644
--- a/apps/desktop/src/components/layout/UpdateDialog.spec.ts
+++ b/apps/desktop/src/components/layout/UpdateDialog.spec.ts
@@ -172,6 +172,19 @@ describe("UpdateDialog active task guard", () => {
   });
 });
 
+describe("UpdateDialog download progress", () => {
+  it("keeps the downloading button at a fixed width as progress changes", async () => {
+    const { state } = await mountDialog(0, { isDownloadingUpdate: true, downloadProgress: 9 });
+
+    expect(buttonWithText("Downloading 9%")?.classList.contains("w-52")).toBe(true);
+
+    state.downloadProgress = 100;
+    await flushDialog();
+
+    expect(buttonWithText("Downloading 100%")?.classList.contains("w-52")).toBe(true);
+  });
+});
+
 describe("UpdateDialog close protection", () => {
   it("cancels the background download when the close button is clicked", async () => {
     const { state, cancelDownload } = await mountDialog(0, { isDownloadingUpdate: true, downloadProgress: 42 });
diff --git a/apps/desktop/src/components/layout/UpdateDialog.vue b/apps/desktop/src/components/layout/UpdateDialog.vue
index 3c547cb9a..b2d2c241c 100644
--- a/apps/desktop/src/components/layout/UpdateDialog.vue
+++ b/apps/desktop/src/components/layout/UpdateDialog.vue
@@ -144,7 +144,7 @@ watch(
               <Loader2 class="h-4 w-4 animate-spin" />
               {{ t("updates.installing") }}
             </Button>
-            <Button v-else-if="isDownloadingUpdate" disabled>
+            <Button v-else-if="isDownloadingUpdate" class="w-52" disabled>
               <Loader2 class="h-4 w-4 animate-spin" />
               {{ t("updates.downloading", { progress: downloadProgress }) }}
             </Button>