/** * StatusBar Component Tests * * Tests the connection status colour and text helpers used by the * StatusBar component to display the current Claude connection state. * * What this component does: * - Shows a coloured indicator dot for the connection state * - Shows a text label for the connection state * - Provides connect/disconnect buttons * - Contains the working directory input and browse button * - Renders the NavMenu component for all toolbar actions * * Manual testing checklist: * - [ ] Green dot and "Connected" label when Claude is running * - [ ] Animated yellow dot and "Connecting..." label whilst connecting * - [ ] Red dot and "Error" label on connection error * - [ ] Grey dot and "Disconnected" label when not connected * - [ ] Directory input is hidden when connected, visible when disconnected * - [ ] Connect button transitions to Disconnect button on connection * - [ ] NavMenu trigger button visible in the status bar */ import { describe, it, expect } from "vitest"; type ConnectionStatus = "connected" | "connecting" | "disconnected" | "error"; function getStatusColor(connectionStatus: ConnectionStatus): string { switch (connectionStatus) { case "connected": return "bg-green-500"; case "connecting": return "bg-yellow-500 animate-pulse"; case "error": return "bg-red-500"; default: return "bg-gray-500"; } } function getStatusText(connectionStatus: ConnectionStatus): string { switch (connectionStatus) { case "connected": return "Connected"; case "connecting": return "Connecting..."; case "error": return "Error"; default: return "Disconnected"; } } // --- describe("getStatusColor", () => { it("returns green for connected status", () => { expect(getStatusColor("connected")).toBe("bg-green-500"); }); it("returns animated yellow for connecting status", () => { expect(getStatusColor("connecting")).toBe("bg-yellow-500 animate-pulse"); }); it("returns red for error status", () => { expect(getStatusColor("error")).toBe("bg-red-500"); }); it("returns grey for disconnected status", () => { expect(getStatusColor("disconnected")).toBe("bg-gray-500"); }); }); describe("getStatusText", () => { it("returns 'Connected' for connected status", () => { expect(getStatusText("connected")).toBe("Connected"); }); it("returns 'Connecting...' for connecting status", () => { expect(getStatusText("connecting")).toBe("Connecting..."); }); it("returns 'Error' for error status", () => { expect(getStatusText("error")).toBe("Error"); }); it("returns 'Disconnected' for disconnected status", () => { expect(getStatusText("disconnected")).toBe("Disconnected"); }); });