93 lines
3.1 KiB
TypeScript
93 lines
3.1 KiB
TypeScript
// @vitest-environment jsdom
|
|
|
|
import { render, screen } from "@testing-library/react";
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
import {
|
|
CollectionPage,
|
|
DetailPage,
|
|
FormPage,
|
|
StandardPage,
|
|
StatusPage,
|
|
} from "../../src/presentation/templates/index.ts";
|
|
|
|
describe("page template slot contracts", () => {
|
|
it("renders StandardPage minimum and full landmarks with one h1", () => {
|
|
const { rerender } = render(
|
|
<StandardPage heading={{ title: "Minimum" }}>Content</StandardPage>,
|
|
);
|
|
expect(screen.getByRole("heading", { level: 1, name: "Minimum" })).toBeVisible();
|
|
|
|
rerender(
|
|
<StandardPage
|
|
heading={{ title: "Full", description: "Long heading contract" }}
|
|
breadcrumb={<a href="/">Home</a>}
|
|
status={<span>Ready</span>}
|
|
actions={[
|
|
{ kind: "button", label: "Action", onAction: () => {} },
|
|
]}
|
|
notices={<p>Notice</p>}
|
|
feedback={<p role="status">Refreshing</p>}
|
|
aside={<p>Aside</p>}
|
|
>
|
|
Content
|
|
</StandardPage>,
|
|
);
|
|
expect(screen.getAllByRole("heading", { level: 1 })).toHaveLength(1);
|
|
expect(screen.getByRole("navigation", { name: "현재 위치" })).toBeVisible();
|
|
expect(screen.getByRole("complementary", { name: "관련 정보" })).toBeVisible();
|
|
});
|
|
|
|
it("places collection, detail and form state in stable slots", () => {
|
|
const { rerender } = render(
|
|
<CollectionPage
|
|
heading={{ title: "Collection" }}
|
|
toolbar={<button type="button">Filter</button>}
|
|
resultCount="12 results"
|
|
pagination={<a href="?page=2">Next</a>}
|
|
>
|
|
Results
|
|
</CollectionPage>,
|
|
);
|
|
expect(screen.getByRole("region", { name: "검색과 필터" })).toBeVisible();
|
|
expect(screen.getByRole("navigation", { name: "페이지 탐색" })).toBeVisible();
|
|
|
|
rerender(
|
|
<DetailPage
|
|
heading={{ title: "Detail" }}
|
|
metadata={<dl><dt>ID</dt><dd>1</dd></dl>}
|
|
destructiveAction={<button type="button">Delete</button>}
|
|
>
|
|
Sections
|
|
</DetailPage>,
|
|
);
|
|
expect(screen.getByRole("region", { name: "요약 정보" })).toBeVisible();
|
|
expect(screen.getByRole("region", { name: "위험 작업" })).toBeVisible();
|
|
|
|
rerender(
|
|
<FormPage
|
|
heading={{ title: "Form" }}
|
|
errorSummary={<p role="alert">Invalid</p>}
|
|
fields={<input aria-label="Field" />}
|
|
formActions={<button type="button">Save</button>}
|
|
/>,
|
|
);
|
|
expect(screen.getByRole("alert")).toBeVisible();
|
|
expect(screen.getByRole("textbox", { name: "Field" })).toBeVisible();
|
|
});
|
|
|
|
it("renders safe status variants without raw failure values", () => {
|
|
render(
|
|
<StatusPage
|
|
variant="offline"
|
|
heading={{ title: "Offline", description: "Safe recovery copy" }}
|
|
primaryAction={{ kind: "button", label: "Retry", onAction: () => {} }}
|
|
supportReference="SAFE-123"
|
|
/>,
|
|
);
|
|
expect(screen.getByRole("heading", { level: 1, name: "Offline" })).toBeVisible();
|
|
expect(screen.getByText(/SAFE-123/)).toBeVisible();
|
|
expect(document.body).not.toHaveTextContent("stack");
|
|
});
|
|
});
|