Update themed component tests

This commit is contained in:
2026-02-10 22:14:48 -05:00
parent 2e54b81d8f
commit 5abceb7bc7
21 changed files with 239 additions and 240 deletions

View File

@@ -21,8 +21,8 @@ describe("LightButton Component", () => {
expect(button).toHaveClass("border");
expect(button).toHaveClass("cursor-pointer");
//Colors
expect(button).toHaveClass("bg-white", "hover:bg-neutral-300", "active:bg-neutral-400");
expect(button).toHaveClass("border-white", "hover:border-neutral-300", "active:border-neutral-400");
expect(button).toHaveClass("bg-light", "active:bg-light-dark");
expect(button).toHaveClass("border-light", "active:border-light-dark");
expect(button).toHaveClass("text-black");
});
@@ -178,8 +178,8 @@ describe("LightButton Component Disabled", () => {
expect(button).toHaveClass("border");
//Disabled state
expect(button).not.toHaveClass("cursor-pointer");
expect(button).toHaveClass("bg-neutral-400/80");
expect(button).toHaveClass("border-neutral-400/80");
expect(button).toHaveClass("bg-light-light/80");
expect(button).toHaveClass("border-light-light/80");
expect(button).toHaveClass("text-black");
});
it("Renders with custom className when disabled", () => {
@@ -220,8 +220,8 @@ describe("LightButton Component Variants", () => {
const button = screen.getByTestId("mattrixwv-light-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-white", "hover:bg-neutral-300", "active:bg-neutral-400");
expect(button).toHaveClass("border", "border-white", "hover:border-neutral-300", "active:border-neutral-400");
expect(button).toHaveClass("bg-light", "active:bg-light-dark");
expect(button).toHaveClass("border", "border-light", "active:border-light-dark");
expect(button).toHaveClass("text-black");
});
it("Renders with outline variant", () => {
@@ -230,26 +230,26 @@ describe("LightButton Component Variants", () => {
const button = screen.getByTestId("mattrixwv-light-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border", "border-white", "hover:border-neutral-300", "active:border-neutral-400");
expect(button).toHaveClass("text-white", "hover:text-neutral-300", "active:text-neutral-400");
expect(button).toHaveClass("border", "border-light", "active:border-light-dark");
expect(button).toHaveClass("text-light", "active:text-light-dark");
});
it("Renders with outline-ghost variant", () => {
render(<LightButton variant="outline-ghost">{buttonText}</LightButton>);
const button = screen.getByTestId("mattrixwv-light-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent", "hover:bg-white", "active:bg-neutral-300");
expect(button).toHaveClass("border", "border-white", "hover:border-white", "active:border-neutral-300");
expect(button).toHaveClass("text-white", "hover:text-black", "active:text-black");
expect(button).toHaveClass("bg-transparent", "hover:bg-light", "active:bg-light-dark");
expect(button).toHaveClass("border", "border-light", "active:border-light-dark");
expect(button).toHaveClass("text-light", "hover:text-black", "active:text-black");
});
it("Renders with ghost variant", () => {
render(<LightButton variant="ghost">{buttonText}</LightButton>);
const button = screen.getByTestId("mattrixwv-light-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent", "hover:bg-white", "active:bg-neutral-300");
expect(button).toHaveClass("bg-transparent", "hover:bg-light", "active:bg-light-dark");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-white", "hover:text-black", "active:text-black");
expect(button).toHaveClass("text-light", "hover:text-black", "active:text-black");
});
it("Renders with icon variant", () => {
render(<LightButton variant="icon">{buttonText}</LightButton>);
@@ -258,7 +258,7 @@ describe("LightButton Component Variants", () => {
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-white", "hover:text-neutral-300", "active:text-neutral-400");
expect(button).toHaveClass("text-light", "active:text-light-dark");
});
});
@@ -268,8 +268,8 @@ describe("LightButton Component Variants Disabled", () => {
const button = screen.getByTestId("mattrixwv-light-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-neutral-400/80");
expect(button).toHaveClass("border", "border-neutral-400/80");
expect(button).toHaveClass("bg-light-light/80");
expect(button).toHaveClass("border", "border-light-light/80");
expect(button).toHaveClass("text-black");
});
it("Renders with outline variant when disabled", () => {
@@ -278,8 +278,8 @@ describe("LightButton Component Variants Disabled", () => {
const button = screen.getByTestId("mattrixwv-light-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border", "border-neutral-400/80");
expect(button).toHaveClass("text-neutral-400/80");
expect(button).toHaveClass("border", "border-light-light/80");
expect(button).toHaveClass("text-light-light/80");
});
it("Renders with outline-ghost variant when disabled", () => {
render(<LightButton variant="outline-ghost" disabled>{buttonText}</LightButton>);
@@ -287,8 +287,8 @@ describe("LightButton Component Variants Disabled", () => {
const button = screen.getByTestId("mattrixwv-light-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border", "border-neutral-400/80");
expect(button).toHaveClass("text-neutral-400/80");
expect(button).toHaveClass("border", "border-light-light/80");
expect(button).toHaveClass("text-light-light/80");
});
it("Renders with ghost variant when disabled", () => {
render(<LightButton variant="ghost" disabled>{buttonText}</LightButton>);
@@ -297,7 +297,7 @@ describe("LightButton Component Variants Disabled", () => {
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-neutral-400/80");
expect(button).toHaveClass("text-light-light/80");
});
it("Renders with icon variant when disabled", () => {
render(<LightButton variant="icon" disabled>{buttonText}</LightButton>);
@@ -306,6 +306,6 @@ describe("LightButton Component Variants Disabled", () => {
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-neutral-400/80");
expect(button).toHaveClass("text-light-light/80");
});
});