UI6 优化移动首页快捷卡视觉

client/tests/e2e/r5-real-device-feedback-mobile-ux.spec.ts

@@ -263,6 +263,25 @@ async function collectMobileMetrics(page: Page) {
       document.querySelector("[data-testid='mobile-reimbursement-sticky-invoice-add']"),
       document.querySelector("[data-testid='reimbursement-submit']"),
     ].filter(Boolean).map((element) => element!.getBoundingClientRect());
+    const actionLabels = Array.from(document.querySelectorAll("[data-testid^='mobile-action-'][data-testid$='-label']")).map((element) => {
+      const rect = element.getBoundingClientRect();
+      const style = window.getComputedStyle(element);
+      const key = element.getAttribute("data-testid")?.replace(/^mobile-action-/, "").replace(/-label$/, "") ?? "";
+      const icon = document.querySelector(`[data-testid='mobile-action-${key}-icon']`);
+      const iconRect = icon?.getBoundingClientRect();
+      return {
+        text: element.textContent?.trim() ?? "",
+        width: rect.width,
+        height: rect.height,
+        right: rect.right,
+        lineHeight: Number.parseFloat(style.lineHeight) || 24,
+        whiteSpace: style.whiteSpace,
+        iconLeft: iconRect?.left ?? null,
+        iconWidth: iconRect?.width ?? 0,
+        iconHeight: iconRect?.height ?? 0,
+        gapToIcon: iconRect ? iconRect.left - rect.right : null,
+      };
+    });
     return {
       width: window.innerWidth,
       height: window.innerHeight,
@@ -278,6 +297,7 @@ async function collectMobileMetrics(page: Page) {
         stickyButtons.length === 2 ? Math.abs(stickyButtons[0].top - stickyButtons[1].top) <= 2 : stickyButtons.length <= 1,
       stickyButtonMinHeight: stickyButtons.length ? Math.min(...stickyButtons.map((rect) => rect.height)) : 0,
       stickyButtonMinWidth: stickyButtons.length ? Math.min(...stickyButtons.map((rect) => rect.width)) : 0,
+      actionLabels,
       text: document.body?.innerText ?? "",
     };
   });
@@ -314,6 +334,16 @@ test.describe("R5 真机反馈移动交互", () => {
         expect(homeMetrics.bottomNavBottomGap).not.toBeNull();
         expect(homeMetrics.bottomNavBottomGap!).toBeLessThanOrEqual(2);
         expect(homeMetrics.scrollWidth).toBeLessThanOrEqual(homeMetrics.width + 2);
+        expect(homeMetrics.actionLabels.length).toBeGreaterThanOrEqual(4);
+        for (const label of homeMetrics.actionLabels) {
+          expect(label.whiteSpace, `${device.label} ${label.text} action label no wrap`).toBe("nowrap");
+          expect(label.height, `${device.label} ${label.text} action label single line`).toBeLessThanOrEqual(label.lineHeight + 2);
+          expect(label.width, `${device.label} ${label.text} action label readable width`).toBeGreaterThanOrEqual(40);
+          expect(label.iconWidth, `${device.label} ${label.text} action icon width`).toBeGreaterThanOrEqual(28);
+          expect(label.iconHeight, `${device.label} ${label.text} action icon height`).toBeGreaterThanOrEqual(28);
+          expect(label.gapToIcon, `${device.label} ${label.text} action label/icon spacing`).not.toBeNull();
+          expect(label.gapToIcon!, `${device.label} ${label.text} action label/icon spacing`).toBeGreaterThanOrEqual(6);
+        }
         for (const item of homeMetrics.navItems) {
           expect(item.visible, `${device.label} ${item.key} nav item visible`).toBe(true);
           expect(item.width, `${device.label} ${item.key} nav item touch width`).toBeGreaterThanOrEqual(44);