interactive.test.ts

 1import {
 2    NOT_ENOUGH_STATES_ERROR,
 3    NO_DEFAULT_OR_BASE_ERROR,
 4    interactive,
 5} from "./interactive"
 6import { describe, it, expect } from "vitest"
 7
 8describe("interactive", () => {
 9    it("creates an Interactive<Element> with base properties and states", () => {
10        const result = interactive({
11            base: { font_size: 10, color: "#FFFFFF" },
12            state: {
13                hovered: { color: "#EEEEEE" },
14                clicked: { color: "#CCCCCC" },
15            },
16        })
17
18        expect(result).toEqual({
19            default: { color: "#FFFFFF", font_size: 10 },
20            hovered: { color: "#EEEEEE", font_size: 10 },
21            clicked: { color: "#CCCCCC", font_size: 10 },
22        })
23    })
24
25    it("creates an Interactive<Element> with no base properties", () => {
26        const result = interactive({
27            state: {
28                default: { color: "#FFFFFF", font_size: 10 },
29                hovered: { color: "#EEEEEE" },
30                clicked: { color: "#CCCCCC" },
31            },
32        })
33
34        expect(result).toEqual({
35            default: { color: "#FFFFFF", font_size: 10 },
36            hovered: { color: "#EEEEEE", font_size: 10 },
37            clicked: { color: "#CCCCCC", font_size: 10 },
38        })
39    })
40
41    it("throws error when both default and base are missing", () => {
42        const state = {
43            hovered: { color: "blue" },
44        }
45
46        expect(() => interactive({ state })).toThrow(NO_DEFAULT_OR_BASE_ERROR)
47    })
48
49    it("throws error when no other state besides default is present", () => {
50        const state = {
51            default: { font_size: 10 },
52        }
53
54        expect(() => interactive({ state })).toThrow(NOT_ENOUGH_STATES_ERROR)
55    })
56})