Pin the chat scroll fix: constrain the middle column flex chain #27

Merged
weichen merged 4 commits from feature/chat-scroll-fix into main 2026-09-30 09:18:36 +00:00
Owner

聊天页滚动修复(feature/chat-scroll-fix)

缺陷(用户实测报告)

消息超出视口后:页面无法向下滚动、回复看不全、输入栏被顶出视口。

根因

中栏列向 flex 链 .main → .chat → .chat-body 缺 min-height: 0:flex 项的自动最小高度=内容高度,.chat 被消息内容撑到视口之外,.chat-body 的 overflow-y: auto 因此永不触发,输入栏(flex 末项)被挤出屏幕;.app 的 overflow: hidden 又裁掉了溢出部分,页面整体无滚动条。

修复

modules/frontend src/styles.css:为 .chat 与 .chat-body 补 min-height: 0(两条规则,附约束链注释)。Frontend 仓提交 a54022c。

证据(Why/Evidence/Impact/Refs 详见提交与任务卡)

  • 无头 Chromium(1024x620,mock 长会话):
    • 修复前:.chat=2130px,input-bar 底边 717px(超视口 97px),chat-body scrollable=false;
    • 修复后:.chat=620px=视口,chat-body clientH 501 / scrollH 2011(可滚、自动滚到底),input-bar 底边=620px。
  • 变体:空会话、单条短消息、1024x400(滚轮上滚 600px 后回底)、720x600 —— 输入栏全部贴底可见。
  • 组合验证:make test 全绿(core + backend + frontend 9 + ui 23 + agentcmd)。
  • 附带:.gitignore 增补 /data-test/(本地测试运行数据目录,防 precheck 误报 BUSY)。
# 聊天页滚动修复(feature/chat-scroll-fix) ## 缺陷(用户实测报告) 消息超出视口后:页面无法向下滚动、回复看不全、输入栏被顶出视口。 ## 根因 中栏列向 flex 链 `.main → .chat → .chat-body` 缺 `min-height: 0`:flex 项的自动最小高度=内容高度,`.chat` 被消息内容撑到视口之外,`.chat-body` 的 `overflow-y: auto` 因此永不触发,输入栏(flex 末项)被挤出屏幕;`.app` 的 `overflow: hidden` 又裁掉了溢出部分,页面整体无滚动条。 ## 修复 `modules/frontend src/styles.css`:为 `.chat` 与 `.chat-body` 补 `min-height: 0`(两条规则,附约束链注释)。Frontend 仓提交 a54022c。 ## 证据(Why/Evidence/Impact/Refs 详见提交与任务卡) - 无头 Chromium(1024x620,mock 长会话): - 修复前:`.chat`=2130px,input-bar 底边 717px(超视口 97px),chat-body scrollable=false; - 修复后:`.chat`=620px=视口,chat-body clientH 501 / scrollH 2011(可滚、自动滚到底),input-bar 底边=620px。 - 变体:空会话、单条短消息、1024x400(滚轮上滚 600px 后回底)、720x600 —— 输入栏全部贴底可见。 - 组合验证:`make test` 全绿(core + backend + frontend 9 + ui 23 + agentcmd)。 - 附带:`.gitignore` 增补 `/data-test/`(本地测试运行数据目录,防 precheck 误报 BUSY)。
weichen added 3 commits 2026-09-30 09:18:14 +00:00
Why: the chat page could not scroll once messages exceeded the viewport
and the input bar was pushed off-screen (missing min-height:0 on the
column flex chain .main->.chat->.chat-body).
Evidence: combo make test green with the advanced frontend gitlink;
headless-Chromium before/after measurements and four layout variants
recorded in the task card.
Impact: middle column only; also ignore /data-test/ local runtime data
so precheck does not report BUSY on the user's test artifacts.
Refs: Agent-System-Frontend a54022c (feature/chat-scroll-fix).
Record the sync checkpoint
ci / test (pull_request) Failing after 1m58s
5929bc0788
weichen added 1 commit 2026-09-30 09:18:24 +00:00
Record the sync checkpoint
ci / test (pull_request) Failing after 1m37s
bd58531a57
weichen merged commit 10b1065602 into main 2026-09-30 09:18:36 +00:00
Sign in to join this conversation.
No Reviewers
No labels
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: weichen/Agent-System-Dev#27