Josh Knapp
1524ec4a98
The sidebar config panel content was overflowing its container width, causing project names and directory paths to be clipped. Added min-w-0 and overflow-hidden to flex containers, and restructured folder path config rows to stack vertically instead of cramming into one line. The Windows taskbar was showing a black square because no default window icon was set at runtime. Added default_window_icon() call in the Tauri builder using the app's icon.png. Also adds vitest test infrastructure with tests verifying both fixes. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
55 lines
1.8 KiB
TypeScript
55 lines
1.8 KiB
TypeScript
import { describe, it, expect, vi, beforeEach } from "vitest";
|
|
import { render, screen } from "@testing-library/react";
|
|
import Sidebar from "./Sidebar";
|
|
|
|
// Mock zustand store
|
|
vi.mock("../../store/appState", () => ({
|
|
useAppState: vi.fn((selector) =>
|
|
selector({
|
|
sidebarView: "projects",
|
|
setSidebarView: vi.fn(),
|
|
})
|
|
),
|
|
}));
|
|
|
|
// Mock child components to isolate Sidebar layout testing
|
|
vi.mock("../projects/ProjectList", () => ({
|
|
default: () => <div data-testid="project-list">ProjectList</div>,
|
|
}));
|
|
vi.mock("../settings/SettingsPanel", () => ({
|
|
default: () => <div data-testid="settings-panel">SettingsPanel</div>,
|
|
}));
|
|
|
|
describe("Sidebar", () => {
|
|
beforeEach(() => {
|
|
vi.clearAllMocks();
|
|
});
|
|
|
|
it("renders the sidebar with content area", () => {
|
|
render(<Sidebar />);
|
|
expect(screen.getByText("Projects")).toBeInTheDocument();
|
|
expect(screen.getByText("Settings")).toBeInTheDocument();
|
|
});
|
|
|
|
it("content area has min-w-0 to prevent flex overflow", () => {
|
|
const { container } = render(<Sidebar />);
|
|
const contentArea = container.querySelector(".overflow-y-auto");
|
|
expect(contentArea).not.toBeNull();
|
|
expect(contentArea!.className).toContain("min-w-0");
|
|
});
|
|
|
|
it("content area has overflow-x-hidden to prevent horizontal scroll", () => {
|
|
const { container } = render(<Sidebar />);
|
|
const contentArea = container.querySelector(".overflow-y-auto");
|
|
expect(contentArea).not.toBeNull();
|
|
expect(contentArea!.className).toContain("overflow-x-hidden");
|
|
});
|
|
|
|
it("sidebar outer container has overflow-hidden", () => {
|
|
const { container } = render(<Sidebar />);
|
|
const sidebar = container.firstElementChild;
|
|
expect(sidebar).not.toBeNull();
|
|
expect(sidebar!.className).toContain("overflow-hidden");
|
|
});
|
|
});
|