BaseLibraries/MattrixwvReactComponents
1
0
Fork 0
Code Issues 3 Packages Projects Releases Wiki Activity

Update themed component tests

Browse Source
This commit is contained in:
Matthew Ellison
2026-02-10 22:14:48 -05:00
parent 2e54b81d8f
commit 5abceb7bc7
21 changed files with 239 additions and 240 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
test/component/button/SuccessButton.test.tsx
View File

@@ -21,9 +21,9 @@ describe("SuccessButton Component", () => {
expect(button).toHaveClass("border");
expect(button).toHaveClass("cursor-pointer");
//Colors
expect(button).toHaveClass("bg-green-600", "hover:bg-green-700", "active:bg-green-800");
expect(button).toHaveClass("border-green-600", "hover:border-green-700", "active:border-green-800");
expect(button).toHaveClass("text-white");
expect(button).toHaveClass("bg-success", "active:bg-success-dark");
expect(button).toHaveClass("border-success", "active:border-success-dark");
expect(button).toHaveClass("text-black");
});
it("Renders with custom className", () => {
@@ -177,9 +177,9 @@ describe("SuccessButton Component Disabled", () => {
expect(button).toHaveClass("border");
//Disabled state
expect(button).not.toHaveClass("cursor-pointer");
expect(button).toHaveClass("bg-green-400/80");
expect(button).toHaveClass("border-green-400/80");
expect(button).toHaveClass("text-white");
expect(button).toHaveClass("bg-success-light/80");
expect(button).toHaveClass("border-success-light/80");
expect(button).toHaveClass("text-black");
});
it("Renders with custom className when disabled", () => {
const customClass = "custom-success-button-class";
@@ -218,9 +218,9 @@ describe("SuccessButton Component Variants", () => {
const button = screen.getByTestId("mattrixwv-success-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-green-600", "hover:bg-green-700", "active:bg-green-800");
expect(button).toHaveClass("border", "border-green-600", "hover:border-green-700", "active:border-green-800");
expect(button).toHaveClass("text-white");
expect(button).toHaveClass("bg-success", "active:bg-success-dark");
expect(button).toHaveClass("border", "border-success", "active:border-success-dark");
expect(button).toHaveClass("text-black");
});
it("Renders with outline variant", () => {
render(<SuccessButton variant="outline">{buttonText}</SuccessButton>);
@@ -228,26 +228,26 @@ describe("SuccessButton Component Variants", () => {
const button = screen.getByTestId("mattrixwv-success-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border", "border-green-600", "hover:border-green-700", "active:border-green-800");
expect(button).toHaveClass("text-green-600", "hover:text-green-700", "active:text-green-800");
expect(button).toHaveClass("border", "border-success", "active:border-success-dark");
expect(button).toHaveClass("text-success", "active:text-success-dark");
});
it("Renders with outline-ghost variant", () => {
render(<SuccessButton variant="outline-ghost">{buttonText}</SuccessButton>);
const button = screen.getByTestId("mattrixwv-success-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent", "hover:bg-green-600", "active:bg-green-700");
expect(button).toHaveClass("border", "border-green-600", "hover:border-green-600", "active:border-green-700");
expect(button).toHaveClass("text-green-600", "hover:text-white", "active:text-white");
expect(button).toHaveClass("bg-transparent", "hover:bg-success", "active:bg-success-dark");
expect(button).toHaveClass("border", "border-success", "active:border-success-dark");
expect(button).toHaveClass("text-success", "hover:text-black", "active:text-black");
});
it("Renders with ghost variant", () => {
render(<SuccessButton variant="ghost">{buttonText}</SuccessButton>);
const button = screen.getByTestId("mattrixwv-success-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent", "hover:bg-green-600", "active:bg-green-700");
expect(button).toHaveClass("bg-transparent", "hover:bg-success", "active:bg-success-dark");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-green-600", "hover:text-white", "active:text-white");
expect(button).toHaveClass("text-success", "hover:text-black", "active:text-black");
});
it("Renders with icon variant", () => {
render(<SuccessButton variant="icon">{buttonText}</SuccessButton>);
@@ -256,7 +256,7 @@ describe("SuccessButton Component Variants", () => {
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-green-600", "hover:text-green-700", "active:text-green-800");
expect(button).toHaveClass("text-success", "active:text-success-dark");
});
});
@@ -266,9 +266,9 @@ describe("SuccessButton Component Variants Disabled", () => {
const button = screen.getByTestId("mattrixwv-success-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-green-400/80");
expect(button).toHaveClass("border", "border-green-400/80");
expect(button).toHaveClass("text-white");
expect(button).toHaveClass("bg-success-light/80");
expect(button).toHaveClass("border", "border-success-light/80");
expect(button).toHaveClass("text-black");
});
it("Renders with outline variant when disabled", () => {
render(<SuccessButton variant="outline" disabled>{buttonText}</SuccessButton>);
@@ -276,8 +276,8 @@ describe("SuccessButton Component Variants Disabled", () => {
const button = screen.getByTestId("mattrixwv-success-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border", "border-green-400/80");
expect(button).toHaveClass("text-green-400/80");
expect(button).toHaveClass("border", "border-success-light/80");
expect(button).toHaveClass("text-success-light/80");
});
it("Renders with outline-ghost variant when disabled", () => {
render(<SuccessButton variant="outline-ghost" disabled>{buttonText}</SuccessButton>);
@@ -285,8 +285,8 @@ describe("SuccessButton Component Variants Disabled", () => {
const button = screen.getByTestId("mattrixwv-success-button");
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border", "border-green-400/80");
expect(button).toHaveClass("text-green-400/80");
expect(button).toHaveClass("border", "border-success-light/80");
expect(button).toHaveClass("text-success-light/80");
});
it("Renders with ghost variant when disabled", () => {
render(<SuccessButton variant="ghost" disabled>{buttonText}</SuccessButton>);
@@ -295,7 +295,7 @@ describe("SuccessButton Component Variants Disabled", () => {
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-green-400/80");
expect(button).toHaveClass("text-success-light/80");
});
it("Renders with icon variant when disabled", () => {
render(<SuccessButton variant="icon" disabled>{buttonText}</SuccessButton>);
@@ -304,6 +304,6 @@ describe("SuccessButton Component Variants Disabled", () => {
expect(button).toBeInTheDocument();
expect(button).toHaveClass("bg-transparent");
expect(button).toHaveClass("border-none");
expect(button).toHaveClass("text-green-400/80");
expect(button).toHaveClass("text-success-light/80");
});
});