🤖 fix: stabilize bash story expansion and strict bash args (#1130)

Fix Storybook flakiness in App/Bash Foreground by scoping expand clicks
to the message window and removing the timing-based delay.

Also ensure Storybook bash tool mocks always include required fields so
they render with BashToolCall instead of GenericToolCall.

_Generated with `mux`_

Author: ammar-agent

src/browser/stories/App.bash.stories.tsx

@@ -35,27 +35,36 @@ async function expandAllBashTools(canvasElement: HTMLElement) {
     { timeout: 5000 }
   );
 
-  // Now find and expand all tool icons
+  // Now find and expand all tool icons (scoped to the message window so we don't click unrelated ▶)
+  const messageWindow = canvasElement.querySelector('[data-testid="message-window"]');
+  if (!(messageWindow instanceof HTMLElement)) {
+    throw new Error("Message window not found");
+  }
+
+  // Wait for at least one expand icon to appear in the message window
   await waitFor(
-    async () => {
-      const allSpans = canvasElement.querySelectorAll("span");
+    () => {
+      const allSpans = messageWindow.querySelectorAll("span");
       const expandIcons = Array.from(allSpans).filter((span) => span.textContent?.trim() === "▶");
       if (expandIcons.length === 0) {
         throw new Error("No expand icons found");
       }
-      for (const icon of expandIcons) {
-        const header = icon.closest("[class*='cursor-pointer']");
-        if (header) {
-          await userEvent.click(header as HTMLElement);
-        }
-      }
     },
     { timeout: 5000 }
   );
 
-  // Wait for focus auto-select timer, then blur
-  await new Promise((resolve) => setTimeout(resolve, 150));
-  (document.activeElement as HTMLElement)?.blur();
+  const allSpans = messageWindow.querySelectorAll("span");
+  const expandIcons = Array.from(allSpans).filter((span) => span.textContent?.trim() === "▶");
+
+  for (const icon of expandIcons) {
+    const header = icon.closest("div.cursor-pointer");
+    if (header) {
+      await userEvent.click(header as HTMLElement);
+    }
+  }
+
+  // Avoid leaving focus on a tool header (some components auto-focus inputs on timers)
+  (document.activeElement as HTMLElement | null)?.blur?.();
 }
 
 export default {

src/browser/stories/mockFactory.ts

@@ -261,14 +261,20 @@ export function createBashTool(
   output: string,
   exitCode = 0,
   timeoutSecs = 3,
-  durationMs = 50
+  durationMs = 50,
+  displayName = "Bash"
 ): MuxPart {
   return {
     type: "dynamic-tool",
     toolCallId,
     toolName: "bash",
     state: "output-available",
-    input: { script, run_in_background: false, timeout_secs: timeoutSecs },
+    input: {
+      script,
+      run_in_background: false,
+      timeout_secs: timeoutSecs,
+      display_name: displayName,
+    },
     output: { success: exitCode === 0, output, exitCode, wall_duration_ms: durationMs },
   };
 }
@@ -342,14 +348,20 @@ export function createBackgroundBashTool(
   toolCallId: string,
   script: string,
   processId: string,
-  displayName?: string
+  displayName = "Background",
+  timeoutSecs = 60
 ): MuxPart {
   return {
     type: "dynamic-tool",
     toolCallId,
     toolName: "bash",
     state: "output-available",
-    input: { script, run_in_background: true, display_name: displayName },
+    input: {
+      script,
+      run_in_background: true,
+      display_name: displayName,
+      timeout_secs: timeoutSecs,
+    },
     output: {
       success: true,
       output: `Background process started with ID: ${processId}`,
@@ -365,8 +377,9 @@ export function createMigratedBashTool(
   toolCallId: string,
   script: string,
   processId: string,
-  displayName?: string,
-  capturedOutput?: string
+  displayName = "Bash",
+  capturedOutput?: string,
+  timeoutSecs = 30
 ): MuxPart {
   const outputLines = capturedOutput?.split("\n") ?? [];
   const outputSummary =
@@ -379,7 +392,12 @@ export function createMigratedBashTool(
     toolName: "bash",
     state: "output-available",
     // No run_in_background flag - this started as foreground
-    input: { script, run_in_background: false, display_name: displayName, timeout_secs: 30 },
+    input: {
+      script,
+      run_in_background: false,
+      display_name: displayName,
+      timeout_secs: timeoutSecs,
+    },
     output: {
       success: true,
       output: `Process sent to background with ID: ${processId}\n\nOutput so far (${outputLines.length} lines):\n${outputSummary}`,

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

@@ -74,7 +74,7 @@ describe("hasInterruptedStream", () => {
         historyId: "assistant-1",
         toolName: "bash",
         toolCallId: "call-1",
-        args: { script: "echo test" },
+        args: { script: "echo test", timeout_secs: 10, display_name: "Test" },
         status: "interrupted",
         isPartial: true,
         historySequence: 2,

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

@@ -78,7 +78,7 @@ describe("sanitizeToolInputs", () => {
             toolCallId: "toolu_02test",
             toolName: "bash",
             state: "output-available",
-            input: { script: "ls", timeout_secs: 10 },
+            input: { script: "ls", timeout_secs: 10, display_name: "Test" },
             output: { success: true },
           },
         ],
@@ -89,7 +89,7 @@ describe("sanitizeToolInputs", () => {
     const sanitized = sanitizeToolInputs(messages);
     expect(sanitized[0].parts[0]).toMatchObject({
       type: "dynamic-tool",
-      input: { script: "ls", timeout_secs: 10 },
+      input: { script: "ls", timeout_secs: 10, display_name: "Test" },
     });
   });
 

src/common/types/tools.ts

@@ -9,7 +9,7 @@ import type { TOOL_DEFINITIONS } from "@/common/utils/tools/toolDefinitions";
 // Bash Tool Types
 export interface BashToolArgs {
   script: string;
-  timeout_secs?: number; // Optional: defaults to 3 seconds for interactivity
+  timeout_secs: number; // Required - defaults should be applied by producers
   run_in_background?: boolean; // Run without blocking (for long-running processes)
   display_name: string; // Required - used as process identifier if sent to background
 }

src/node/services/mock/scenarios/permissionModes.ts

@@ -86,6 +86,7 @@ const executePlanTurn: ScenarioTurn = {
           script:
             'apply_patch <<\'PATCH\'\n*** Begin Patch\n*** Update File: src/utils/legacyFunction.ts\n@@\n-export function handleRequest(input: Request) {\n-  if (!input.userId || !input.payload) {\n-    throw new Error("Missing fields");\n-  }\n-\n-  const result = heavyFormatter(input.payload);\n-  return {\n-    id: input.userId,\n-    details: result,\n-  };\n-}\n+function verifyInputs(input: Request) {\n+  if (!input.userId || !input.payload) {\n+    throw new Error("Missing fields");\n+  }\n+}\n+\n+function buildResponse(input: Request) {\n+  const result = heavyFormatter(input.payload);\n+  return { id: input.userId, details: result };\n+}\n+\n+export function handleRequest(input: Request) {\n+  verifyInputs(input);\n+  return buildResponse(input);\n+}\n*** End Patch\nPATCH',
           timeout_secs: 10,
+          display_name: "Apply refactor",
         },
       },
       {

src/node/services/mock/scenarios/toolFlows.ts

@@ -90,7 +90,7 @@ const listDirectoryTurn: ScenarioTurn = {
         delay: STREAM_BASE_DELAY,
         toolCallId: "tool-bash-ls",
         toolName: "bash",
-        args: { script: "ls -1", timeout_secs: 10 },
+        args: { script: "ls -1", timeout_secs: 10, display_name: "List directory" },
       },
       {
         kind: "tool-end",
@@ -164,7 +164,11 @@ const createTestFileTurn: ScenarioTurn = {
         delay: STREAM_BASE_DELAY,
         toolCallId: "tool-bash-create-test-file",
         toolName: "bash",
-        args: { script: "printf 'hello' > test.txt", timeout_secs: 10 },
+        args: {
+          script: "printf 'hello' > test.txt",
+          timeout_secs: 10,
+          display_name: "Create test file",
+        },
       },
       {
         kind: "tool-end",

src/node/services/partialService.test.ts

@@ -108,7 +108,7 @@ describe("PartialService - Error Recovery", () => {
           toolCallId: "call-1",
           toolName: "bash",
           state: "input-available",
-          input: { script: "echo test" },
+          input: { script: "echo test", timeout_secs: 10, display_name: "Test" },
         },
       ],
     };

src/node/services/tools/bash.test.ts

@@ -1459,6 +1459,7 @@ describe("bash tool - background execution", () => {
     const tool = testEnv.tool;
     const args: BashToolArgs = {
       script: "echo test",
+      timeout_secs: 5,
       run_in_background: true,
       display_name: "test",
     };
@@ -1508,6 +1509,7 @@ describe("bash tool - background execution", () => {
     const tool = createBashTool(config);
     const args: BashToolArgs = {
       script: "echo hello",
+      timeout_secs: 5,
       run_in_background: true,
       display_name: "test",
     };