feat: add button press feedback

2026-07-21 15:10:08 +02:00
parent 801f847ec4
commit 4c9424f1e3
6 changed files with 178 additions and 1 deletions
@@ -0,0 +1,26 @@
+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;/,
+    );
+  });
+});