Adjust button hover

This commit is contained in:
adilallo
2026-08-15 11:12:41 -06:00
parent 79b5166fa3
commit 79bdb97c69
19 changed files with 82 additions and 92 deletions
+3
View File
@@ -61,6 +61,9 @@ describe("Button (behavioral tests)", () => {
expect(button.className).toContain("duration-150");
expect(button.className).not.toContain("duration-500");
expect(button.className).toContain("active:scale-[0.98]");
expect(button.className).not.toContain("hover:scale-");
expect(button.className).not.toContain("focus-visible:scale-");
expect(button.className).not.toContain("hover:outline-");
});
it("renders as a link when href is provided", () => {
+10
View File
@@ -36,6 +36,16 @@ describe("Logo (behavioral tests)", () => {
expect(logo).toHaveAttribute("aria-label", "CommunityRule Logo");
});
it("animates the mark on hover without scaling the wordmark", () => {
render(<Logo />);
const logo = screen.getByRole("link", { name: /communityrule logo/i });
const wordmark = screen.getByText("CommunityRule");
const mark = logo.querySelector("img");
expect(logo).toHaveClass("group");
expect(wordmark.className).not.toContain("scale-");
expect(mark).toHaveClass("group-hover:scale-110");
});
it("renders logo icon", () => {
render(<Logo />);
expect(screen.getByAltText("CommunityRule Logo")).toBeInTheDocument();
+7 -14
View File
@@ -92,13 +92,15 @@ describe("LogoWall Component", () => {
expect(screen.getByAltText("Food Not Bombs")).toBeInTheDocument();
});
test("applies hover effects", () => {
test("does not apply hover effects on partner logos", () => {
render(<LogoWall />);
const logoContainers = document.querySelectorAll(
'[class*="hover:opacity-100"]',
);
expect(logoContainers.length).toBeGreaterThan(0);
expect(
document.querySelectorAll('[class*="hover:opacity"]').length,
).toBe(0);
expect(
document.querySelectorAll('[class*="hover:scale"]').length,
).toBe(0);
});
test("renders with proper semantic structure", () => {
@@ -142,13 +144,4 @@ describe("LogoWall Component", () => {
expect(foodNotBombsLogo).toBeInTheDocument();
expect(startCoopLogo).toBeInTheDocument();
});
test("applies scale effect on hover", () => {
render(<LogoWall />);
const logos = screen.getAllByRole("img");
logos.forEach((logo) => {
expect(logo).toHaveClass("hover:scale-105");
});
});
});