Maofeng
48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import { describe, expect, it } from "vitest"
|
|
|
|
import {
|
|
accentColors,
|
|
baseColors,
|
|
buildThemeStyleSheet,
|
|
getTheme,
|
|
getThemeCssVariables,
|
|
themes,
|
|
} from "./theme"
|
|
|
|
describe("appearance themes", () => {
|
|
it("defines every selectable base and accent color exactly once", () => {
|
|
const selectableColors = [...baseColors, ...accentColors]
|
|
|
|
expect(themes.map((theme) => theme.name)).toEqual(selectableColors)
|
|
expect(new Set(selectableColors).size).toBe(selectableColors.length)
|
|
expect(new Set(themes.map((theme) => theme.name)).size).toBe(themes.length)
|
|
})
|
|
|
|
it("combines base and accent palettes", () => {
|
|
const variables = getThemeCssVariables("light", {
|
|
accentColor: "rose",
|
|
baseColor: "stone",
|
|
})
|
|
|
|
expect(variables.background).toBe(
|
|
getTheme("stone")?.cssVars.light.background
|
|
)
|
|
expect(variables.highlight).toBe(getTheme("stone")?.cssVars.light.highlight)
|
|
expect(variables.accent).toBe(getTheme("rose")?.cssVars.light.accent)
|
|
})
|
|
|
|
it("builds explicit and system color-scheme rules", () => {
|
|
const styleSheet = buildThemeStyleSheet(
|
|
{ accentColor: "blue", baseColor: "neutral" },
|
|
{ accentColor: "violet", baseColor: "zinc" }
|
|
)
|
|
|
|
expect(styleSheet).toContain(":root,.ui\\:light{")
|
|
expect(styleSheet).toContain(".ui\\:dark{")
|
|
expect(styleSheet).toContain("@media (prefers-color-scheme:dark)")
|
|
expect(styleSheet).toContain("--background:")
|
|
expect(styleSheet).toContain("--accent:")
|
|
expect(styleSheet).toContain("--highlight:")
|
|
})
|
|
})
|