109e74db41
Web UI rework. Shared-components slice (drift prevention): - Migrate SectionCard, SelectionRailCard, TabbedCard, MetricCard, DiskSpaceCard, HoverEditButton, DialogFooter, ConfirmDialog, LibraryOverview, NowPlaying, SessionActivityPanel off @mui - HoverEditButton: MUI IconButton + EditOutlined -> Button + lucide Pencil - Status mapping uses the success Badge variant (chart-2) for healthy - Exported APIs preserved so consuming pages still compile (no page edits) - 11 behavioral Vitest component tests added Gate: build + lint + test green.
53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
import { describe, it, expect, vi } from "vitest";
|
|
import { render, screen } from "@testing-library/react";
|
|
import userEvent from "@testing-library/user-event";
|
|
import { DialogFooter } from "../DialogFooter";
|
|
|
|
describe("DialogFooter", () => {
|
|
it("renders cancel/confirm labels and wires both callbacks", async () => {
|
|
const onCancel = vi.fn();
|
|
const onConfirm = vi.fn();
|
|
render(
|
|
<DialogFooter
|
|
onCancel={onCancel}
|
|
cancelLabel="Cancel"
|
|
onConfirm={onConfirm}
|
|
confirmLabel="Save"
|
|
/>,
|
|
);
|
|
await userEvent.click(screen.getByRole("button", { name: "Cancel" }));
|
|
expect(onCancel).toHaveBeenCalledTimes(1);
|
|
await userEvent.click(screen.getByRole("button", { name: "Save" }));
|
|
expect(onConfirm).toHaveBeenCalledTimes(1);
|
|
});
|
|
|
|
it("prefers the busy label and maps confirmColor=error to destructive", () => {
|
|
render(
|
|
<DialogFooter
|
|
onCancel={() => {}}
|
|
onConfirm={() => {}}
|
|
confirmLabel="Delete"
|
|
confirmBusyLabel="Deleting…"
|
|
confirmColor="error"
|
|
/>,
|
|
);
|
|
const confirm = screen.getByRole("button", { name: "Deleting…" });
|
|
expect(confirm).toBeInTheDocument();
|
|
expect(confirm.getAttribute("data-variant")).toBe("destructive");
|
|
});
|
|
|
|
it("renders the secondary action when provided", () => {
|
|
render(
|
|
<DialogFooter
|
|
onCancel={() => {}}
|
|
onConfirm={() => {}}
|
|
confirmLabel="OK"
|
|
secondaryAction={<button type="button">Test SSH</button>}
|
|
/>,
|
|
);
|
|
expect(
|
|
screen.getByRole("button", { name: "Test SSH" }),
|
|
).toBeInTheDocument();
|
|
});
|
|
});
|