Files
stock-manager/tests/unit/components/layout/sidebar.test.tsx
T

117 lines
3.2 KiB
TypeScript

import { createElement } from "react"
import { renderToStaticMarkup } from "react-dom/server"
import { beforeEach, describe, expect, it, vi } from "vitest"
import { en } from "@/i18n/dictionaries/en"
import { es } from "@/i18n/dictionaries/es"
const mocks = vi.hoisted(() => ({
usePathname: vi.fn(() => "/people"),
Link: ({ href, children }: { href: string; children: React.ReactNode }) =>
createElement("a", { href }, children),
}))
vi.mock("next/navigation", () => ({
usePathname: mocks.usePathname,
redirect: vi.fn(),
}))
vi.mock("next/link", () => ({
default: mocks.Link,
}))
vi.mock("@/components/ui/sidebar", () => {
const Pass = ({ children }: { children: React.ReactNode }) => children
return {
Sidebar: Pass,
SidebarContent: Pass,
SidebarGroup: Pass,
SidebarGroupContent: Pass,
SidebarHeader: Pass,
SidebarMenu: Pass,
SidebarMenuButton: ({
children: buttonChildren,
}: {
children: React.ReactNode
}) => buttonChildren,
SidebarMenuItem: ({
children: itemChildren,
}: {
children: React.ReactNode
}) => createElement("li", null, itemChildren),
}
})
vi.mock("@/components/layout/sidebar/sidebarSection", () => ({
SidebarSection: ({
title,
items,
}: {
title: string
items: { title: string; url: string }[]
}) =>
createElement(
"section",
null,
title,
...items.map((sub) =>
createElement("a", { key: sub.url, href: sub.url }, sub.title),
),
),
}))
describe("app sidebar (consolidated people management)", () => {
beforeEach(() => {
vi.clearAllMocks()
mocks.usePathname.mockReturnValue("/people")
})
it("does NOT render a 'users' link in the sidebar (consolidated under /people)", async () => {
const { default: AppSidebar } = await import("@/components/layout/sidebar")
const html = renderToStaticMarkup(
createElement(AppSidebar, { copy: en.layout.sidebar }),
)
// No /admin/users link must exist anywhere
expect(html).not.toContain("/admin/users")
expect(html).not.toContain(">Users<")
})
it("renders 'People' (not 'Users') in English", async () => {
const { default: AppSidebar } = await import("@/components/layout/sidebar")
const html = renderToStaticMarkup(
createElement(AppSidebar, { copy: en.layout.sidebar }),
)
expect(html).toContain("People")
expect(html).toContain("/people")
})
it("renders 'Personas' (not 'Usuarios') in Spanish", async () => {
const { default: AppSidebar } = await import("@/components/layout/sidebar")
const html = renderToStaticMarkup(
createElement(AppSidebar, { copy: es.layout.sidebar }),
)
expect(html).toContain("Personas")
expect(html).toContain("/people")
expect(html).not.toContain("Usuarios")
})
it("marks the /people entry as active when pathname starts with /people", async () => {
const { default: AppSidebar } = await import("@/components/layout/sidebar")
mocks.usePathname.mockReturnValue("/people/person-1/edit")
const html = renderToStaticMarkup(
createElement(AppSidebar, { copy: en.layout.sidebar }),
)
// The /people link must still be present and reachable
expect(html).toContain("/people")
})
})