agent-Specialization/.astrion/memory/chat_block_scroll_anchor.md

name	description
chat_block_scroll_anchor	当需要优化聊天区域块展开/折叠滚动行为，或排查向上滚动后瞬间跳回问题时，应该索引本记忆

聊天区域块展开/折叠滚动行为优化记录

背景

聊天区域默认使用 vue-stick-to-bottom 保持底部锁定。块（thinking/tool）展开/折叠时，stick-to-bottom 的弹簧追底动画和 CSS 高度过渡不同步，会产生「向下展开一点、向上滚动一点」的顿挫感。

已尝试方案

1. 块展开锚定（useBlockExpansionAnchor）

• 在 static/src/composables/useBlockExpansionAnchor.ts 中实现
• 块展开/折叠的 CSS 过渡期间（约 260–300ms），用 requestAnimationFrame 持续覆盖 scrollTop
• 目标：让被操作块的底边或顶边保持在原来视口位置
• 方向判断：
  • 用底边判断比顶边更准确。高块即使顶边位于上半，底边仍可能在下半；用顶边判断会把高块误判为 down 模式
  • up 模式：底边不动，头部向上展开
  • down 模式：顶边不动，内容向下展开
• 方向在单次展开-收起周期内记忆（preferredModes），保证收起是展开的倒放；收起动画结束后清除记录

2. 运行期间策略

• 运行中的 thinking/tool 块（带 .processing/.running/.thinking-animation）保持旧逻辑，由 stick-to-bottom 追底，避免被输入栏遮挡
• 非运行中的块（包括运行期间的历史块）走锚定逻辑
• 已实现 commit：f43b5ea7 fix(chat): 运行期间恢复旧滚动逻辑，堆叠块更多按钮也接入锚定

3. 堆叠块「更多」按钮

• StackedBlocks.vue 在 toggleMore 时 emit more-toggle，ChatArea.vue 监听后对 more-block 元素启动锚定
• 注意：事件 payload 里的展开状态应使用 payload.expanded，避免 ReferenceError

未解决的向上滚动跳回问题

现象

• 在块较多的对话中，向上滚动后页面会瞬间跳回滚动前的位置
• 向下滚动不会出现
• 禁用 anchorBlockElement 调用、禁用 wheel-up 时的 stopScroll() 后问题依然存在

调试结论

• 不是 anchorBlockElement 直接导致
• 不是 stopScroll() 直接导致
• heightDelta 可能为负（内容高度减小），但 large-growth 检测未触发
• escapedFromLock 已为 true，stick-state-change 未出现异常变化
• 原因未最终定位，可能与 vue-stick-to-bottom 内部状态、浏览器原生滚动行为或内容高度变化后的布局抖动有关

当前代码状态

• 当前 HEAD：f43b5ea7 fix(chat): 运行期间恢复旧滚动逻辑，堆叠块更多按钮也接入锚定
• 工作区干净，所有调试和临时修改已撤回，stash 已清空
• 后续若继续优化，建议从 f43b5ea7 开始，并优先定位向上滚动跳回的根本原因