Files
ThothII/frontend/src/button-press-feedback.test.ts
T

27 lines
1.1 KiB
TypeScript

import { readFileSync } from "node:fs";
import { describe, expect, test } from "vitest";
const css = readFileSync("src/index.css", "utf8");
const sharedButton = readFileSync("src/components/ui/button.tsx", "utf8");
describe("button press feedback", () => {
test("gives every enabled button a short physical press state", () => {
expect(css).toMatch(/button:not\(:disabled\)\s*\{[^}]*transition-duration:\s*140ms;/s);
expect(css).toMatch(
/button:not\(:disabled\):active\s*\{[^}]*transform:\s*scale\(0\.97\);[^}]*filter:\s*brightness\(0\.94\);/s,
);
expect(css).toContain("cubic-bezier(0.22, 1, 0.36, 1)");
expect(sharedButton).not.toContain("active:not-aria-[haspopup]:translate-y-px");
});
test("keeps non-kinetic feedback when reduced motion is requested", () => {
expect(css).toMatch(
/@media \(prefers-reduced-motion: reduce\)\s*\{[\s\S]*?button:not\(:disabled\)\s*\{[^}]*transition-duration:\s*0\.01ms;/,
);
expect(css).toMatch(
/@media \(prefers-reduced-motion: reduce\)\s*\{[\s\S]*?button:not\(:disabled\):active\s*\{[^}]*transform:\s*none;/,
);
});
});