补充对话面板纵向几何的回归断言

- chatDialogFrameLayout.test.ts:新增用例锁定面板必须跨满对话列全部 grid 行、height 100%、且不得叠加 flex 简写
- chatDialogFrameLayout.test.ts:新增断言锁定 direct-codex 面板把消息列表 min-height 从 96px 解除到 0
- 说明这次断言对应的一次真实渲染事故:新会话只有一条欢迎消息时,消息列表塌成 54px、输入盒被拉伸到 212px
This commit is contained in:
2026-09-14 12:49:37 +08:00
parent cd816078a3
commit 8410426d12
@@ -359,4 +359,38 @@ describe('陶泥儿对话区:Codex 三段式(顶栏 / 唯一滚动区 / 文
expect(listIndex, '消息列表必须排在顶栏之后').toBeGreaterThan(topbarIndex);
expect(formOpen, '输入盒必须排在消息列表之后').toBeGreaterThan(listIndex);
});
/**
* 面板纵向必须撑满 `.game-workbench-chat` 的高度。
*
* 这里锁的是一次真实渲染事故:`.game-workbench-chat` 是
* `grid-template-rows: auto minmax(0, 1fr)`(原本给「头部 + 内容」两行用),direct-codex
* 精简掉头部后 supervisor 面板成了第一个子元素、落进第一行 auto 轨道。面板高度一旦大于
* 内容(新会话只有一条欢迎消息时就是如此),面板就被压成内容高度——消息列表塌成几十像素、
* 输入盒被拉伸到两百多像素。实测修法是让面板跨全部行(`grid-row: 1 / -1`)并靠
* `height: 100%` 撑满轨道;`flex: 0 1 auto` 之类的 flex 简写会把 basis 变回 auto,同样塌。
*/
it('面板撑满对话列高度,消息列表不再被压成内容高度', () => {
const chat = desktopDeclarations('.game-workbench-chat');
const surface = desktopDeclarations(
'.game-workbench-chat .project-supervisor-surface',
);
const list = desktopDeclarations('.project-supervisor-message-list');
const listInPanel = desktopDeclarations(MESSAGE_LIST_PLAIN);
const listInPanelDirectCodex = desktopDeclarations(MESSAGE_LIST);
// 对话列仍是两行 grid:面板必须跨全部行,否则只能拿到 auto 行的高度。
expect(declaration(chat, 'display')).toBe('grid');
expect(declaration(surface, 'grid-row')).toBe('1 / -1');
expect(declaration(surface, 'height')).toBe('100%');
// flex 简写会把 basis 变回 auto,面板又会塌成内容高度。
expect(surface.has('flex')).toBe(false);
// 基础规则 `.project-supervisor-message-list { min-height: 340px }` 给列表压了下限;
// 面板里真正生效的是后写的 96px,而 direct-codex 面板必须把它解除到 0——
// 否则空对话时列表被顶高、输入盒被挤出面板(实测就是 panel 的 4564px 那次)。
expect(pixelValue(list, 'min-height')).toBe(340);
expect(pixelValue(listInPanel, 'min-height')).toBe(96);
expect(pixelValue(listInPanelDirectCodex, 'min-height')).toBe(0);
});
});