56f06c961d
Horizontal nav with dropdown submenus, hover-intent delay, keyboard-accessible trigger/content parts, and full Zod v4 schema + ComponentMeta.
59 lines
2.2 KiB
TypeScript
59 lines
2.2 KiB
TypeScript
import { render, screen } from "@solidjs/testing-library";
|
|
import { describe, expect, it } from "vitest";
|
|
import { NavigationMenu } from "../../../src/components/navigation-menu/index";
|
|
import { NavigationMenuRootPropsSchema, NavigationMenuMeta } from "../../../src/components/navigation-menu/navigation-menu.props";
|
|
|
|
describe("NavigationMenu", () => {
|
|
it("renders menu with link items", () => {
|
|
render(() => (
|
|
<NavigationMenu>
|
|
<NavigationMenu.List>
|
|
<NavigationMenu.Item>
|
|
<NavigationMenu.Link href="/about">About</NavigationMenu.Link>
|
|
</NavigationMenu.Item>
|
|
</NavigationMenu.List>
|
|
</NavigationMenu>
|
|
));
|
|
expect(screen.getByText("About")).toBeTruthy();
|
|
});
|
|
|
|
it("renders trigger with content", () => {
|
|
render(() => (
|
|
<NavigationMenu>
|
|
<NavigationMenu.List>
|
|
<NavigationMenu.Item>
|
|
<NavigationMenu.Trigger>Products</NavigationMenu.Trigger>
|
|
<NavigationMenu.Content><div>Product A</div></NavigationMenu.Content>
|
|
</NavigationMenu.Item>
|
|
</NavigationMenu.List>
|
|
</NavigationMenu>
|
|
));
|
|
expect(screen.getByText("Products")).toBeTruthy();
|
|
});
|
|
|
|
it("renders as nav element", () => {
|
|
render(() => (
|
|
<NavigationMenu data-testid="nav">
|
|
<NavigationMenu.List>
|
|
<NavigationMenu.Item><NavigationMenu.Link href="/">Home</NavigationMenu.Link></NavigationMenu.Item>
|
|
</NavigationMenu.List>
|
|
</NavigationMenu>
|
|
));
|
|
expect(screen.getByTestId("nav").tagName).toBe("NAV");
|
|
});
|
|
|
|
it("schema validates orientation", () => {
|
|
expect(NavigationMenuRootPropsSchema.safeParse({ orientation: "horizontal" }).success).toBe(true);
|
|
expect(NavigationMenuRootPropsSchema.safeParse({ orientation: "invalid" }).success).toBe(false);
|
|
});
|
|
|
|
it("meta has required fields", () => {
|
|
expect(NavigationMenuMeta.name).toBe("NavigationMenu");
|
|
expect(NavigationMenuMeta.parts).toContain("Root");
|
|
expect(NavigationMenuMeta.parts).toContain("List");
|
|
expect(NavigationMenuMeta.parts).toContain("Trigger");
|
|
expect(NavigationMenuMeta.parts).toContain("Content");
|
|
expect(NavigationMenuMeta.parts).toContain("Link");
|
|
});
|
|
});
|