From 7362f22f98b8d36011da6751482456dfc00bd982 Mon Sep 17 00:00:00 2001
From: CieanYau <ltd@crash.work>
Date: Fri, 6 Nov 2026 03:22:26 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=AD=A3=E5=9B=BE=E8=A1=A8=E9=87=87?=
 =?UTF-8?q?=E6=A0=B7=E5=89=AF=E4=BD=9C=E7=94=A8=E4=B8=8E=E6=9A=82=E5=81=9C?=
 =?UTF-8?q?=E6=97=B6=E9=92=9F=E4=B8=8B=E7=9A=84=E5=AF=BC=E8=88=AA=E9=AA=8C?=
 =?UTF-8?q?=E6=94=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 tests/review-style-motion.e2e.test.mjs | 33 ++++++++++++++++++--------
 1 file changed, 23 insertions(+), 10 deletions(-)

diff --git a/tests/review-style-motion.e2e.test.mjs b/tests/review-style-motion.e2e.test.mjs
index 85bcb28..317fa65 100644
--- a/tests/review-style-motion.e2e.test.mjs
+++ b/tests/review-style-motion.e2e.test.mjs
@@ -98,6 +98,11 @@ async function enterMonitor(page) {
     (count) => count === 4,
     "The real monitor must render all four charts",
   );
+  await eventually(
+    () => page.getByRole("button", { name: "刷新", exact: true }).isEnabled(),
+    Boolean,
+    "Initial chart responses must finish before observing available data",
+  );
   // 先给无动画图表一个绘制帧，不把 Canvas 的创建本身误认为动画。
   await page.clock.runFor(50);
   await page.mouse.move(0, 0);
@@ -107,15 +112,19 @@ async function enterMonitor(page) {
 async function observeFrames(page, state) {
   const sample = () =>
     page.locator(".chart-viewport canvas").evaluateAll((canvases) =>
-      canvases.map((canvas) => ({
-        width: canvas.width,
-        height: canvas.height,
-        painted: canvas
-          .getContext("2d")
-          .getImageData(0, 0, canvas.width, canvas.height)
-          .data.some((channel) => channel !== 0),
-        image: canvas.toDataURL(),
-      })),
+      canvases.map((canvas) => {
+        const image = canvas.toDataURL();
+        const blank = document.createElement("canvas");
+        blank.width = canvas.width;
+        blank.height = canvas.height;
+        // 不对产品画布反复 getImageData：浏览器可能因此从 GPU 切到 CPU，制造一次性光栅差异。
+        return {
+          width: canvas.width,
+          height: canvas.height,
+          painted: image !== blank.toDataURL(),
+          image,
+        };
+      }),
     );
   const first = await sample();
   assert.equal(
@@ -279,7 +288,11 @@ test(
           .first()
           .click();
         await eventually(
-          () => page.locator(".chart-viewport canvas").count(),
+          async () => {
+            // 导航也依赖浏览器任务/rAF；暂停时钟下只轮询 DOM 会阻止真实路由完成卸载。
+            await page.clock.runFor(50);
+            return page.locator(".chart-viewport canvas").count();
+          },
           (count) => count === 0,
           "Leaving the instance must unmount the monitor charts",
         );