Files
biggus-dickus/web/src/shell/breadcrumb.test.tsx
T

49 lines
1.6 KiB
TypeScript

import { expect, test } from "vitest";
import { screen, within } from "@testing-library/react";
import { Routes, Route } from "react-router-dom";
import { renderApp } from "../test/render";
import { AppShell } from "./app-shell";
import { ObjectNewPage } from "../objects/object-new-page";
import { BreadcrumbProvider } from "./breadcrumb-provider";
import { Breadcrumb } from "./breadcrumb";
import { useBreadcrumb } from "./use-breadcrumb";
function Setter() {
useBreadcrumb([
{ label: "Objects", to: "/objects" },
{ label: "LM-0042" },
]);
return null;
}
test("renders the trail with a link on non-leaf crumbs", async () => {
renderApp(
<BreadcrumbProvider>
<Breadcrumb />
<Setter />
</BreadcrumbProvider>,
);
const link = await screen.findByRole("link", { name: "Objects" });
expect(link).toHaveAttribute("href", "/objects");
expect(screen.getByText("LM-0042")).toBeInTheDocument();
expect(screen.getByRole("navigation", { name: /breadcrumb/i })).toBeInTheDocument();
});
test("a nested route sets the header breadcrumb inside AppShell", async () => {
renderApp(
<Routes>
<Route element={<AppShell />}>
<Route path="/objects/new" element={<ObjectNewPage />} />
</Route>
</Routes>,
{ route: "/objects/new" },
);
const nav = await screen.findByRole("navigation", { name: "Breadcrumb" });
const within_nav = within(nav);
const objectsLink = within_nav.getByRole("link", { name: "Objects" });
expect(objectsLink).toHaveAttribute("href", "/objects");
expect(within_nav.getByText("New object")).toBeInTheDocument();
});