File size: 1,589 Bytes
3201ca6 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | import { describe, expect, it } from "vitest";
import {
EXTENSION_MODULE_CARD_GRID_SINGLE_COLUMN_MAX_PX,
EXTENSION_MODULE_CARD_INTERACTIVE_CLASS,
extensionModuleCardGridClassName,
extensionModuleCardGridContainerClassName,
extensionModuleCardInteractiveClassName,
extensionModuleCardPillClassName,
extensionModuleCardSurfaceClassName,
} from "#/utils/extension-module-card-classes";
describe("extensionModuleCardInteractive class", () => {
it("uses a dedicated CSS class for focus styling", () => {
expect(EXTENSION_MODULE_CARD_INTERACTIVE_CLASS).toBe(
"extension-module-card-interactive",
);
expect(extensionModuleCardInteractiveClassName).toBe(
EXTENSION_MODULE_CARD_INTERACTIVE_CLASS,
);
});
});
describe("extensionModuleCardSurface class", () => {
it("omits a resting border so tiles stay flush until hover", () => {
expect(extensionModuleCardSurfaceClassName).not.toContain("border");
});
});
describe("extensionModuleCardPill class", () => {
it("omits an outline so chips stay fill-only", () => {
expect(extensionModuleCardPillClassName).not.toContain("border");
});
});
describe("extensionModuleCardGrid classes", () => {
it("uses a container query breakpoint at 600px column width", () => {
expect(EXTENSION_MODULE_CARD_GRID_SINGLE_COLUMN_MAX_PX).toBe(599);
expect(extensionModuleCardGridContainerClassName).toContain("@container");
expect(extensionModuleCardGridClassName).toContain("@min-[600px]:grid-cols-2");
expect(extensionModuleCardGridClassName).not.toContain("md:grid-cols-2");
});
});
|