فهرست منبع

fix: stabilize agent drawers during live refresh

gangvy 1 ماه پیش
والد
کامیت
89bef08561
3فایلهای تغییر یافته به همراه11 افزوده شده و 9 حذف شده
  1. 4 4
      mcp/src/dashboard/styles.css
  2. 4 2
      scripts/agent-workspace-ui-smoke-test.js
  3. 3 3
      todolist/2026-08-04-dashboard-gray-overlay-port.md

+ 4 - 4
mcp/src/dashboard/styles.css

@@ -604,10 +604,10 @@ html, body {
 .agent-commandbar .agent-mode-btn.active { color: var(--agent-brand-strong); background: var(--agent-panel); box-shadow: 0 1px 5px rgba(31, 38, 51, .09); }
 .agent-commandbar .agent-mode-btn.danger.active { color: var(--agent-error); background: var(--agent-error-soft); }
 
-.agent-drawer-backdrop { position: fixed; inset: 68px 0 0 220px; z-index: 70; border: 0; background: rgba(24, 29, 41, .26); opacity: 0; pointer-events: none; transition: opacity .18s ease; }
-.agent-drawer-backdrop.open { opacity: 1; pointer-events: auto; }
-.agent-drawer { position: fixed; top: 68px; right: 0; bottom: 0; z-index: 80; width: min(440px, calc(100vw - 220px)); display: grid; grid-template-rows: auto minmax(0, 1fr); border-left: 1px solid var(--agent-line); background: var(--agent-panel); box-shadow: -18px 0 44px rgba(24, 30, 42, .16); transform: translateX(102%); visibility: hidden; transition: transform .2s ease, visibility .2s; }
-.agent-drawer.open { transform: translateX(0); visibility: visible; }
+.agent-drawer-backdrop { position: fixed; inset: 68px 0 0 220px; z-index: 70; border: 0; background: rgba(24, 29, 41, .26); opacity: 0; pointer-events: none; transition: none; }
+.agent-drawer-backdrop.open { opacity: 1; pointer-events: auto; transition: none; }
+.agent-drawer { position: fixed; top: 68px; right: 0; bottom: 0; z-index: 80; width: min(440px, calc(100vw - 220px)); display: grid; grid-template-rows: auto minmax(0, 1fr); border-left: 1px solid var(--agent-line); background: var(--agent-panel); box-shadow: -18px 0 44px rgba(24, 30, 42, .16); transform: translateX(102%); visibility: hidden; transition: none; }
+.agent-drawer.open { transform: translateX(0); visibility: visible; transition: none; }
 .agent-drawer > header { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; border-bottom: 1px solid var(--agent-line); }
 .agent-drawer > header strong,
 .agent-drawer > header span { display: block; }

+ 4 - 2
scripts/agent-workspace-ui-smoke-test.js

@@ -58,8 +58,10 @@ check('mobile layout is bounded and keeps controls reachable', () => {
 
 check('closed Agent drawers do not leave a gray page overlay', () => {
   assert.match(styles, /\.content\s*>\s*\.agent-page\s*>\s*\*\s*\{\s*animation:\s*none;/);
-  assert.match(styles, /\.agent-drawer-backdrop\s*\{[^}]*opacity:\s*0;[^}]*pointer-events:\s*none;/);
-  assert.match(styles, /\.agent-drawer-backdrop\.open\s*\{[^}]*opacity:\s*1;[^}]*pointer-events:\s*auto;/);
+  assert.match(styles, /\.agent-drawer-backdrop\s*\{[^}]*opacity:\s*0;[^}]*pointer-events:\s*none;[^}]*transition:\s*none;/);
+  assert.match(styles, /\.agent-drawer\s*\{[^}]*visibility:\s*hidden;[^}]*transition:\s*none;/);
+  assert.match(styles, /\.agent-drawer-backdrop\.open\s*\{[^}]*opacity:\s*1;[^}]*pointer-events:\s*auto;[^}]*transition:\s*none;/);
+  assert.match(styles, /\.agent-drawer\.open\s*\{[^}]*visibility:\s*visible;[^}]*transition:\s*none;/);
 });
 
 check('conversation ordering has explicit invalid-time and stable-tie behavior', () => {

+ 3 - 3
todolist/2026-08-04-dashboard-gray-overlay-port.md

@@ -21,14 +21,14 @@
 
 - Agent 工作台直属子项不再继承通用页面区块入场动画。
 - 关闭态遮罩保持 `opacity: 0` 和 `pointer-events: none`。
-- 打开态遮罩过渡到 `opacity: 1`,设置抽屉正常从右侧进入。
+- 打开态遮罩立即切换到 `opacity: 1`,设置抽屉立即可见。
+- 实时状态刷新会重建抽屉 DOM,因此开关状态不使用 CSS 过渡,避免动画被反复重置。
 - 修复同步到独立通用仓、旧通用工作副本和小牛业务安装副本。
 
 ## 验收
 
 - [x] 三份 `agent-workspace-ui-smoke-test.js` 均为 10/10。
 - [x] 关闭态:遮罩透明、抽屉隐藏、页面可交互。
-- [x] 打开态:遮罩和抽屉约 250ms 内完成过渡
+- [x] 打开态:遮罩和抽屉立即显示,不受实时数据刷新影响
 - [x] 再次关闭:遮罩恢复透明、抽屉隐藏。
 - [x] 页面标题、正文、健康接口正常,浏览器运行异常为 0。
-