36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
import { render, screen } from "@testing-library/react";
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
import { Badge } from "./badge";
|
|
|
|
describe("Badge", () => {
|
|
it("renders with root and label slots plus data hooks", () => {
|
|
render(
|
|
<Badge size="sm" tone="success" variant="solid">
|
|
Stable
|
|
</Badge>
|
|
);
|
|
|
|
const badge = screen.getByText("Stable").closest('[data-slot="root"]');
|
|
|
|
expect(badge).toBeInTheDocument();
|
|
expect(badge).toHaveAttribute("data-size", "sm");
|
|
expect(badge).toHaveAttribute("data-tone", "success");
|
|
expect(badge).toHaveAttribute("data-variant", "solid");
|
|
expect(screen.getByText("Stable")).toHaveAttribute("data-slot", "label");
|
|
});
|
|
|
|
it("supports asChild rendering", () => {
|
|
render(
|
|
<Badge asChild tone="primary">
|
|
<a href="/release">Release</a>
|
|
</Badge>
|
|
);
|
|
|
|
const link = screen.getByRole("link", { name: "Release" });
|
|
|
|
expect(link).toHaveAttribute("data-slot", "root");
|
|
expect(link).toHaveAttribute("data-tone", "primary");
|
|
});
|
|
});
|