diff --git a/packages/ds-react-core/src/ui/Chip/Chip.test.tsx b/packages/ds-react-core/src/ui/Chip/Chip.test.tsx new file mode 100644 index 00000000..2504b382 --- /dev/null +++ b/packages/ds-react-core/src/ui/Chip/Chip.test.tsx @@ -0,0 +1,61 @@ +import { render, screen } from "@testing-library/react"; +import { describe, expect, it, vi } from "vitest"; +import Component from "./Chip.js"; + +describe("Chip component", () => { + it("renders", () => { + render(); + expect(screen.getByText("AWS")).toBeDefined(); + }); + + it("applies className", () => { + render( + , + ); + const chip = screen.getByText("Cloud").parentElement; + expect(chip?.classList).toContain("chip"); + expect(chip?.classList).toContain("test-class"); + }); + + it("applies lead", () => { + render(); + expect(screen.getByText("Cloud")).toBeDefined(); + }); + + it("applies value", () => { + render(); + expect(screen.getByText("AWS")).toBeDefined(); + }); + + it("applies lead & value", () => { + render(); + expect(screen.getByText("AWS")).toBeDefined(); + expect(screen.getByText("Cloud")).toBeDefined(); + }); + + it("applies appearance", () => { + render(); + expect(screen.getByText("Cloud").parentElement?.classList).toContain( + "positive", + ); + }); + + it("calls onClick", () => { + const onClick = vi.fn(); + render(); + screen.getByText("AWS").click(); + expect(onClick).toHaveBeenCalled(); + }); + + it("calls onDismiss", () => { + const onDismiss = vi.fn(); + render(); + screen.getByLabelText("Dismiss").click(); + expect(onDismiss).toHaveBeenCalled(); + }); +});