🤖 fix: normalize live bash output rendering

Change-Id: If9a4747c2cd9cc9461d1730445e83f9cf219a61d
Signed-off-by: Thomas Kosiewski <tk@coder.com>

Author: ThomasK33

src/browser/components/tools/BashToolCall.tsx

@@ -41,6 +41,7 @@ interface BashToolCallProps {
 const EMPTY_LIVE_OUTPUT = {
   stdout: "",
   stderr: "",
+  combined: "",
   truncated: false,
 };
 
@@ -68,7 +69,7 @@ export const BashToolCall: React.FC<BashToolCallProps> = ({
   };
 
   const liveOutputView = liveOutput ?? EMPTY_LIVE_OUTPUT;
-  const combinedLiveOutput = liveOutputView.stdout + liveOutputView.stderr;
+  const combinedLiveOutput = liveOutputView.combined;
 
   useEffect(() => {
     const el = outputRef.current;
@@ -110,8 +111,6 @@ export const BashToolCall: React.FC<BashToolCallProps> = ({
   const showLiveOutput =
     !isBackground && (status === "executing" || (Boolean(liveOutput) && !resultHasOutput));
 
-  const liveLabelSuffix = status === "executing" ? " (live)" : " (tail)";
-
   return (
     <ToolContainer expanded={expanded}>
       <ToolHeader onClick={toggleExpanded}>
@@ -189,7 +188,7 @@ export const BashToolCall: React.FC<BashToolCallProps> = ({
               )}
 
               <DetailSection>
-                <DetailLabel>{`Output${liveLabelSuffix}`}</DetailLabel>
+                <DetailLabel>Output</DetailLabel>
                 <DetailContent
                   ref={outputRef}
                   onScroll={(e) => updatePinned(e.currentTarget)}

src/browser/utils/messages/liveBashOutputBuffer.test.ts

@@ -6,22 +6,36 @@ describe("appendLiveBashOutputChunk", () => {
     const a = appendLiveBashOutputChunk(undefined, { text: "out1\n", isError: false }, 1024);
     expect(a.stdout).toBe("out1\n");
     expect(a.stderr).toBe("");
+    expect(a.combined).toBe("out1\n");
     expect(a.truncated).toBe(false);
 
     const b = appendLiveBashOutputChunk(a, { text: "err1\n", isError: true }, 1024);
     expect(b.stdout).toBe("out1\n");
     expect(b.stderr).toBe("err1\n");
+    expect(b.combined).toBe("out1\nerr1\n");
     expect(b.truncated).toBe(false);
   });
 
+  it("normalizes carriage returns to newlines", () => {
+    const a = appendLiveBashOutputChunk(undefined, { text: "a\rb", isError: false }, 1024);
+    expect(a.stdout).toBe("a\nb");
+    expect(a.combined).toBe("a\nb");
+
+    const b = appendLiveBashOutputChunk(undefined, { text: "a\r\nb", isError: false }, 1024);
+    expect(b.stdout).toBe("a\nb");
+    expect(b.combined).toBe("a\nb");
+  });
+
   it("drops the oldest segments to enforce maxBytes", () => {
     const maxBytes = 5;
     const a = appendLiveBashOutputChunk(undefined, { text: "1234", isError: false }, maxBytes);
     expect(a.stdout).toBe("1234");
+    expect(a.combined).toBe("1234");
     expect(a.truncated).toBe(false);
 
     const b = appendLiveBashOutputChunk(a, { text: "abc", isError: false }, maxBytes);
     expect(b.stdout).toBe("abc");
+    expect(b.combined).toBe("abc");
     expect(b.truncated).toBe(true);
   });
 
@@ -34,13 +48,15 @@ describe("appendLiveBashOutputChunk", () => {
     // total "a" (1) + "bb" (2) + "ccc" (3) = 6 (fits)
     expect(c.stdout).toBe("accc");
     expect(c.stderr).toBe("bb");
+    expect(c.combined).toBe("abbccc");
     expect(c.truncated).toBe(false);
 
     const d = appendLiveBashOutputChunk(c, { text: "DD", isError: true }, maxBytes);
     // total would be 8, so drop oldest segments until <= 6.
     // Drops stdout "a" (1) then stderr "bb" (2) => remaining "ccc" (3) + "DD" (2) = 5
     expect(d.stdout).toBe("ccc");
     expect(d.stderr).toBe("DD");
+    expect(d.combined).toBe("cccDD");
     expect(d.truncated).toBe(true);
   });
 
@@ -49,6 +65,7 @@ describe("appendLiveBashOutputChunk", () => {
     const a = appendLiveBashOutputChunk(undefined, { text: "hello", isError: false }, maxBytes);
     expect(a.stdout).toBe("");
     expect(a.stderr).toBe("");
+    expect(a.combined).toBe("");
     expect(a.truncated).toBe(true);
   });
 });

src/browser/utils/messages/liveBashOutputBuffer.ts

@@ -1,6 +1,8 @@
 export interface LiveBashOutputView {
   stdout: string;
   stderr: string;
+  /** Combined output in emission order (stdout/stderr interleaved). */
+  combined: string;
   truncated: boolean;
 }
 
@@ -21,6 +23,11 @@ export interface LiveBashOutputInternal extends LiveBashOutputView {
   totalBytes: number;
 }
 
+function normalizeNewlines(text: string): string {
+  // Many CLIs print "progress" output using carriage returns so they can update a single line.
+  // In our UI, that reads better as actual line breaks.
+  return text.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
+}
 function getUtf8ByteLength(text: string): number {
   return new TextEncoder().encode(text).length;
 }
@@ -39,30 +46,34 @@ export function appendLiveBashOutputChunk(
     ({
       stdout: "",
       stderr: "",
+      combined: "",
       truncated: false,
       segments: [],
       totalBytes: 0,
     } satisfies LiveBashOutputInternal);
 
-  if (chunk.text.length === 0) return base;
+  const normalizedText = normalizeNewlines(chunk.text);
+  if (normalizedText.length === 0) return base;
 
   // Clone for purity (tests + avoids hidden mutation assumptions).
   const next: LiveBashOutputInternal = {
     stdout: base.stdout,
     stderr: base.stderr,
+    combined: base.combined,
     truncated: base.truncated,
     segments: base.segments.slice(),
     totalBytes: base.totalBytes,
   };
 
   const segment: LiveBashOutputSegment = {
     isError: chunk.isError,
-    text: chunk.text,
-    bytes: getUtf8ByteLength(chunk.text),
+    text: normalizedText,
+    bytes: getUtf8ByteLength(normalizedText),
   };
 
   next.segments.push(segment);
   next.totalBytes += segment.bytes;
+  next.combined += segment.text;
   if (segment.isError) {
     next.stderr += segment.text;
   } else {
@@ -75,6 +86,7 @@ export function appendLiveBashOutputChunk(
 
     next.totalBytes -= removed.bytes;
     next.truncated = true;
+    next.combined = next.combined.slice(removed.text.length);
 
     if (removed.isError) {
       next.stderr = next.stderr.slice(removed.text.length);
@@ -91,5 +103,10 @@ export function appendLiveBashOutputChunk(
 }
 
 export function toLiveBashOutputView(state: LiveBashOutputInternal): LiveBashOutputView {
-  return { stdout: state.stdout, stderr: state.stderr, truncated: state.truncated };
+  return {
+    stdout: state.stdout,
+    stderr: state.stderr,
+    combined: state.combined,
+    truncated: state.truncated,
+  };
 }