From c2c2d5eb510ec72fb3b4f7a44a808432cb91d913 Mon Sep 17 00:00:00 2001 From: AstroHan Date: Sun, 23 Aug 2026 21:11:07 +0800 Subject: [PATCH 1/2] fix(ui): contain expanded tool call rows Generated-by: Maka --- .../src/renderer/styles/chat-message.css | 5 ++- packages/ui/stories/tool-activity.stories.tsx | 45 +++++++++++++++++++ 2 files changed, 49 insertions(+), 1 deletion(-) diff --git a/apps/desktop/src/renderer/styles/chat-message.css b/apps/desktop/src/renderer/styles/chat-message.css index 6a3d192ba4..3df4aa0064 100644 --- a/apps/desktop/src/renderer/styles/chat-message.css +++ b/apps/desktop/src/renderer/styles/chat-message.css @@ -147,8 +147,11 @@ /* Astryx clips the animated group body with overflow:hidden. `clip` preserves that visual boundary without becoming a scroll ancestor that captures the - nested sticky row. */ + nested sticky row. The inner wrapper is also a grid item: without an explicit + zero minimum its long, nowrap call preview becomes the track's minimum size + and stretches every expanded row past the turn instead of ellipsizing it. */ .maka-turn .maka-tool-activity-card > [role="button"] + div > div { + min-width: 0; overflow: clip; } diff --git a/packages/ui/stories/tool-activity.stories.tsx b/packages/ui/stories/tool-activity.stories.tsx index 5a8ab686ce..656224bbd9 100644 --- a/packages/ui/stories/tool-activity.stories.tsx +++ b/packages/ui/stories/tool-activity.stories.tsx @@ -19,6 +19,7 @@ import { useEffect, useRef } from 'react'; import type { Meta, StoryObj } from '@storybook/react-vite'; +import { expect, userEvent, within } from 'storybook/test'; import { ToolCallDetail, ToolTrow } from '../src/tool-activity.js'; import type { ToolActivityItem } from '../src/materialize.js'; import { @@ -231,3 +232,47 @@ export const ContiguousDiffGroup: Story = { ), }; + +const longIntentItems: ToolActivityItem[] = [ + { + toolUseId: 'explore-agent-long-intent', + toolName: 'ExploreAgent', + displayName: '只读探索', + activityKind: 'tool', + status: 'completed', + intent: '审计模型选择、切换、持久化、event log、replay/resume 路径：当前模型事实由谁持有，何时切换，是否已有事件或消息可表达', + args: {}, + }, + { + toolUseId: 'explore-agent-long-intent-2', + toolName: 'ExploreAgent', + displayName: '只读探索', + activityKind: 'tool', + status: 'completed', + intent: '审计提示词构筑与缓存路径：追踪 durable system prompt、turnTailPrompt、provider-visible messages 与 request shape', + args: {}, + }, +]; + +// Regression path: a narrow conversation contains a grouped ExploreAgent run +// whose intent summaries are much wider than the reading column. Expanding the +// group must truncate those rows without widening the turn itself. +export const LongIntentGroupNarrow: Story = { + args: { items: longIntentItems }, + render: (args) => ( +
+ +
+ ), + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await userEvent.click(canvas.getByRole('button', { name: /2 次工具调用|2 tool calls/i })); + const turn = canvas.getByTestId('narrow-turn'); + const group = turn.querySelector('.maka-tool-activity-card'); + expect(group).not.toBeNull(); + const rows = Array.from(group?.querySelectorAll('[role="button"]') ?? []); + expect(Math.max(...rows.map((row) => row.getBoundingClientRect().width))).toBeLessThanOrEqual( + turn.clientWidth + 8, + ); + }, +}; From 444b002e7583c07f012e0cc9ebf62ecb01bf1ee9 Mon Sep 17 00:00:00 2001 From: AstroHan Date: Sun, 23 Aug 2026 22:33:30 +0800 Subject: [PATCH 2/2] test(ui): target tool group disclosure Generated-by: Maka --- packages/ui/stories/tool-activity.stories.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/ui/stories/tool-activity.stories.tsx b/packages/ui/stories/tool-activity.stories.tsx index 656224bbd9..2c77e07804 100644 --- a/packages/ui/stories/tool-activity.stories.tsx +++ b/packages/ui/stories/tool-activity.stories.tsx @@ -266,11 +266,15 @@ export const LongIntentGroupNarrow: Story = { ), play: async ({ canvasElement }) => { const canvas = within(canvasElement); - await userEvent.click(canvas.getByRole('button', { name: /2 次工具调用|2 tool calls/i })); const turn = canvas.getByTestId('narrow-turn'); const group = turn.querySelector('.maka-tool-activity-card'); expect(group).not.toBeNull(); - const rows = Array.from(group?.querySelectorAll('[role="button"]') ?? []); + const disclosure = group!.querySelector( + ':scope > [role="button"][aria-controls]', + ); + expect(disclosure).not.toBeNull(); + await userEvent.click(disclosure!); + const rows = Array.from(group!.querySelectorAll('[role="button"]')); expect(Math.max(...rows.map((row) => row.getBoundingClientRect().width))).toBeLessThanOrEqual( turn.clientWidth + 8, );