Skip to content

fix(chat): contain activity response previews #26

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
chryzxc merged 1 commit into from
Aug 4, 2026
Merged

fix(chat): contain activity response previews #26

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions tests/regression/chat-css-regression.test.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@ const panelComponentsSource = readSource(
[joinFromRoot('webview', 'shared', 'src', 'chat', 'PanelComponents.tsx')],
'panel components source',
);
const messageComponentsSource = readSource(
[joinFromRoot('webview', 'shared', 'src', 'chat', 'MessageComponents.tsx')],
'message components source',
);

test('chat source css keeps active Tailwind directives', () => {
assert.match(chatCssSource, /^\s*@tailwind\s+base\s*;/m, 'chat source css must include @tailwind base directive');
Expand Down Expand Up @@ -136,6 +140,19 @@ test('activity path tooltips use an owned opaque surface', () => {
);
});

test('response previews stay contained inside activity cards', () => {
assert.match(
messageComponentsSource,
/const responseSectionClass = hasResponseContent\s*\? "min-w-0 max-w-full overflow-hidden rounded-md border border-oc-border-soft bg-background p-2\.5 shadow-sm"/,
'response cards must clip oversized activity output to their own boundary',
);
assert.match(
messageComponentsSource,
/"relative min-w-0 max-w-full mt-1\.5 space-y-1\.5",\s*shouldConstrainResponsePreview && "max-h-32 overflow-hidden"/,
'the bounded response preview must shrink with its card so its expand control remains visible',
);
});

// ── Markdown list styling regression tests ───────────────────────────────────────

test('markdown-body ordered lists must display with decimal numbers (not bullets)', () => {
Expand Down
4 changes: 2 additions & 2 deletions webview/shared/src/chat/MessageComponents.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11742,7 +11742,7 @@ const hasVisibleResponseSectionContent =
}, [responseChunksToRender, shouldConstrainResponsePreview]);

const responseSectionClass = hasResponseContent
? "rounded-md border border-oc-border-soft bg-background p-2.5 shadow-sm"
? "min-w-0 max-w-full overflow-hidden rounded-md border border-oc-border-soft bg-background p-2.5 shadow-sm"
: "p-0 border-0 bg-transparent shadow-none";
const hasCopyableResponseContent = (visibleResolvedContent?.trim()?.length ?? 0) > 0;
const handleCopy = async () => {
Expand Down Expand Up @@ -12750,7 +12750,7 @@ const hasVisibleResponseSectionContent =
<div
ref={responsePreviewRef}
className={cn(
"relative mt-1.5 space-y-1.5",
"relative min-w-0 max-w-full mt-1.5 space-y-1.5",
shouldConstrainResponsePreview && "max-h-32 overflow-hidden",
)}
Comment on lines +12753 to 12755

@coderabbitai coderabbitai Bot Aug 4, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Keep the overflow state when the response expands.

When the response exceeds max-h-32, hasResponseOverflow becomes true. After the user clicks Show full response, the effect at Lines 11724-11742 clears this state. The Show less control at Lines 12776-12789 then disappears.

Retain the measured state while expanded, or measure overflow against the collapsed height independently.

🤖 Prompt for AI Agents 
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@webview/shared/src/chat/MessageComponents.tsx` around lines 12753 - 12755,
Update the response preview overflow handling near
shouldConstrainResponsePreview so expanding via “Show full response” does not
clear hasResponseOverflow. Preserve the measured overflow state, or measure it
independently against the collapsed max-h-32 constraint, so the “Show less”
control in the response toggle remains available.

>
Expand Down
Loading