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