WIP! A BB-style forum, on the ATmosphere! We're still working... we'll be back soon when we have something to show off!
node typescript hono htmx atproto
4
fork

Configure Feed

Select the types of activity you want to include in your feed.

test(web): add failing preset completeness tests (ATB-52)

Malpercio 01de4c31 745e5ec5

+60
+60
apps/web/src/styles/presets/__tests__/presets.test.ts
··· 1 + import { describe, it, expect } from "vitest"; 2 + import neobrutalLight from "../neobrutal-light.json"; 3 + import neobrutalDark from "../neobrutal-dark.json"; 4 + import { tokensToCss } from "../../../lib/theme.js"; 5 + 6 + const REQUIRED_TOKENS = [ 7 + // Colors 8 + "color-bg", "color-surface", "color-text", "color-text-muted", 9 + "color-primary", "color-primary-hover", "color-secondary", 10 + "color-border", "color-shadow", "color-success", "color-warning", 11 + "color-danger", "color-code-bg", "color-code-text", 12 + // Typography 13 + "font-body", "font-heading", "font-mono", 14 + "font-size-base", "font-size-sm", "font-size-xs", 15 + "font-size-lg", "font-size-xl", "font-size-2xl", 16 + "font-weight-normal", "font-weight-bold", 17 + "line-height-body", "line-height-heading", 18 + // Spacing & layout 19 + "space-xs", "space-sm", "space-md", "space-lg", "space-xl", 20 + "radius", "border-width", "shadow-offset", "content-width", 21 + // Components 22 + "button-radius", "button-shadow", "card-radius", "card-shadow", 23 + "btn-press-hover", "btn-press-active", 24 + "input-radius", "input-border", "nav-height", 25 + ]; 26 + 27 + describe("neobrutal-light preset", () => { 28 + it("contains all required tokens including font-size-xs", () => { 29 + for (const token of REQUIRED_TOKENS) { 30 + expect(neobrutalLight, `missing token: ${token}`).toHaveProperty(token); 31 + } 32 + }); 33 + 34 + it("produces valid CSS via tokensToCss", () => { 35 + const css = tokensToCss(neobrutalLight as Record<string, string>); 36 + expect(css).toContain("--color-bg:"); 37 + expect(css).toContain("--font-size-xs:"); 38 + expect(css).toContain("--nav-height:"); 39 + }); 40 + }); 41 + 42 + describe("neobrutal-dark preset", () => { 43 + it("contains all required tokens including font-size-xs", () => { 44 + for (const token of REQUIRED_TOKENS) { 45 + expect(neobrutalDark, `missing token: ${token}`).toHaveProperty(token); 46 + } 47 + }); 48 + 49 + it("has a darker background than the light preset", () => { 50 + expect((neobrutalDark as Record<string, string>)["color-bg"]).not.toBe( 51 + (neobrutalLight as Record<string, string>)["color-bg"] 52 + ); 53 + }); 54 + 55 + it("produces valid CSS via tokensToCss", () => { 56 + const css = tokensToCss(neobrutalDark as Record<string, string>); 57 + expect(css).toContain("--color-bg:"); 58 + expect(css).toContain("--font-size-xs:"); 59 + }); 60 + });