|
1 | | -import {expect, it, vi} from 'vitest' |
| 1 | +/* eslint-disable @typescript-eslint/no-unsafe-member-access */ |
| 2 | +/* eslint-disable @typescript-eslint/no-explicit-any */ |
| 3 | + |
| 4 | +import {describe, expect, it, vi} from 'vitest' |
2 | 5 |
|
3 | 6 | import {Formulier} from '../src/form.js' |
4 | 7 | import {getPath} from '../src/state-utils.js' |
5 | 8 |
|
6 | 9 | const INITIAL_VALUES = {a: {b: {c: 'c', d: 'd'}}} |
7 | 10 |
|
8 | | -it('copies initial values', () => { |
9 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
10 | | - expect(form.store.getState().values).toBe(INITIAL_VALUES) |
11 | | -}) |
| 11 | +describe('form', () => { |
| 12 | + it('copies initial values', () => { |
| 13 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 14 | + expect(form.store.getState().values).toBe(INITIAL_VALUES) |
| 15 | + }) |
12 | 16 |
|
13 | | -it('calls listeners', () => { |
14 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
15 | | - const listener = vi.fn(() => undefined) |
16 | | - form.store.subscribe(listener) |
17 | | - form.setFieldValue('a.b.c', 'd') |
18 | | - expect(listener).toHaveBeenCalledTimes(1) |
19 | | -}) |
| 17 | + it('calls listeners', () => { |
| 18 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 19 | + const listener = vi.fn(() => undefined) |
| 20 | + form.store.subscribe(listener) |
| 21 | + form.setFieldValue('a.b.c', 'd') |
| 22 | + expect(listener).toHaveBeenCalledTimes(1) |
| 23 | + }) |
20 | 24 |
|
21 | | -it('removes listeners', () => { |
22 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
23 | | - const listener = vi.fn(() => undefined) |
24 | | - const cancel = form.store.subscribe(listener) |
25 | | - cancel() |
26 | | - form.setFieldValue('a.b.c', 'd') |
27 | | - expect(listener).toHaveBeenCalledTimes(0) |
28 | | - expect(form.store['listeners'].size).toBe(0) |
29 | | -}) |
| 25 | + it('removes listeners', () => { |
| 26 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 27 | + const listener = vi.fn(() => undefined) |
| 28 | + const cancel = form.store.subscribe(listener) |
| 29 | + cancel() |
| 30 | + form.setFieldValue('a.b.c', 'd') |
| 31 | + expect(listener).toHaveBeenCalledTimes(0) |
| 32 | + expect(form.store['listeners'].size).toBe(0) |
| 33 | + }) |
30 | 34 |
|
31 | | -it('touches fields', () => { |
32 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
33 | | - expect(form.store.getState().touched['a.b.c']).toBe(undefined) |
34 | | - form.touchField('a.b.c') |
35 | | - expect(form.store.getState().touched['a.b.c']).toBe(true) |
36 | | -}) |
| 35 | + it('touches fields', () => { |
| 36 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 37 | + expect(form.store.getState().touched['a.b.c']).toBe(undefined) |
| 38 | + form.touchField('a.b.c') |
| 39 | + expect(form.store.getState().touched['a.b.c']).toBe(true) |
| 40 | + }) |
37 | 41 |
|
38 | | -it('increments submit count', () => { |
39 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
40 | | - expect(form.store.getState().submitCount).toBe(0) |
41 | | - form.incrementSubmitCount() |
42 | | - form.incrementSubmitCount() |
43 | | - expect(form.store.getState().submitCount).toBe(2) |
44 | | -}) |
| 42 | + it('increments submit count', () => { |
| 43 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 44 | + expect(form.store.getState().submitCount).toBe(0) |
| 45 | + form.incrementSubmitCount() |
| 46 | + form.incrementSubmitCount() |
| 47 | + expect(form.store.getState().submitCount).toBe(2) |
| 48 | + }) |
45 | 49 |
|
46 | | -it('should not call listeners if setFieldValue does nothing', () => { |
47 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
48 | | - const listener = vi.fn(() => undefined) |
49 | | - form.store.subscribe(listener) |
50 | | - expect(listener).toHaveBeenCalledTimes(0) |
51 | | - form.setFieldValue('a.b.c', 'd') |
52 | | - expect(listener).toHaveBeenCalledTimes(1) |
53 | | - form.setFieldValue('a.b.c', 'd') |
54 | | - expect(listener).toHaveBeenCalledTimes(1) |
55 | | -}) |
| 50 | + it('should not call listeners if setFieldValue does nothing', () => { |
| 51 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 52 | + const listener = vi.fn(() => undefined) |
| 53 | + form.store.subscribe(listener) |
| 54 | + expect(listener).toHaveBeenCalledTimes(0) |
| 55 | + form.setFieldValue('a.b.c', 'd') |
| 56 | + expect(listener).toHaveBeenCalledTimes(1) |
| 57 | + form.setFieldValue('a.b.c', 'd') |
| 58 | + expect(listener).toHaveBeenCalledTimes(1) |
| 59 | + }) |
56 | 60 |
|
57 | | -it('should not call listeners if touchField does nothing', () => { |
58 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
59 | | - const listener = vi.fn(() => undefined) |
60 | | - form.store.subscribe(listener) |
61 | | - expect(listener).toHaveBeenCalledTimes(0) |
62 | | - form.touchField('a.b.c') |
63 | | - expect(listener).toHaveBeenCalledTimes(1) |
64 | | - form.touchField('a.b.c') |
65 | | - expect(listener).toHaveBeenCalledTimes(1) |
66 | | -}) |
| 61 | + it('should not call listeners if touchField does nothing', () => { |
| 62 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 63 | + const listener = vi.fn(() => undefined) |
| 64 | + form.store.subscribe(listener) |
| 65 | + expect(listener).toHaveBeenCalledTimes(0) |
| 66 | + form.touchField('a.b.c') |
| 67 | + expect(listener).toHaveBeenCalledTimes(1) |
| 68 | + form.touchField('a.b.c') |
| 69 | + expect(listener).toHaveBeenCalledTimes(1) |
| 70 | + }) |
67 | 71 |
|
68 | | -it('registers and unregisters fields', () => { |
69 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
70 | | - const validator = () => null |
71 | | - expect((form.store.getState().values as any).b).toBe(undefined) |
72 | | - expect(form.store.getState().touched['b']).toBe(undefined) |
73 | | - expect(form.store.getState().errors['b']).toBe(undefined) |
74 | | - expect(form.store.getState().validators['b']).toBe(undefined) |
75 | | - const unregisterB = form.registerField('b', validator) |
76 | | - const unregisterC = form.registerField('c', undefined) |
77 | | - expect((form.store.getState().values as any).b).toBe(null) |
78 | | - expect(form.store.getState().touched['b']).toBe(false) |
79 | | - expect(form.store.getState().errors['b']).toBe(null) |
80 | | - expect(form.store.getState().validators['b']).toBe(validator) |
81 | | - expect(form.store.getState().validators['c']).toBe(null) |
82 | | - form.setFieldValue('b', 'value') |
83 | | - form.setFieldValue('c', 'value') |
84 | | - expect(getPath(form.store.getState().values, 'b')).toBe('value') |
85 | | - form.registerField('b', validator) |
86 | | - form.registerField('c', undefined) |
87 | | - expect(getPath(form.store.getState().values, 'b')).toBe('value') |
88 | | - unregisterB() |
89 | | - unregisterC() |
90 | | - expect((form.store.getState().values as any).b).toBe(undefined) |
91 | | - expect(form.store.getState().touched['b']).toBe(undefined) |
92 | | - expect(form.store.getState().errors['b']).toBe(undefined) |
93 | | - expect(form.store.getState().validators['b']).toBe(undefined) |
94 | | - expect(form.store.getState().validators['c']).toBe(undefined) |
95 | | -}) |
| 72 | + it('registers and unregisters fields', () => { |
| 73 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 74 | + const validator = () => null |
| 75 | + expect((form.store.getState().values as any).b).toBe(undefined) |
| 76 | + expect(form.store.getState().touched['b']).toBe(undefined) |
| 77 | + expect(form.store.getState().errors['b']).toBe(undefined) |
| 78 | + expect(form.store.getState().validators['b']).toBe(undefined) |
| 79 | + const unregisterB = form.registerField('b', validator) |
| 80 | + const unregisterC = form.registerField('c', undefined) |
| 81 | + expect((form.store.getState().values as any).b).toBe(null) |
| 82 | + expect(form.store.getState().touched['b']).toBe(false) |
| 83 | + expect(form.store.getState().errors['b']).toBe(null) |
| 84 | + expect(form.store.getState().validators['b']).toBe(validator) |
| 85 | + expect(form.store.getState().validators['c']).toBe(null) |
| 86 | + form.setFieldValue('b', 'value') |
| 87 | + form.setFieldValue('c', 'value') |
| 88 | + expect(getPath(form.store.getState().values, 'b')).toBe('value') |
| 89 | + form.registerField('b', validator) |
| 90 | + form.registerField('c', undefined) |
| 91 | + expect(getPath(form.store.getState().values, 'b')).toBe('value') |
| 92 | + unregisterB() |
| 93 | + unregisterC() |
| 94 | + expect((form.store.getState().values as any).b).toBe(undefined) |
| 95 | + expect(form.store.getState().touched['b']).toBe(undefined) |
| 96 | + expect(form.store.getState().errors['b']).toBe(undefined) |
| 97 | + expect(form.store.getState().validators['b']).toBe(undefined) |
| 98 | + expect(form.store.getState().validators['c']).toBe(undefined) |
| 99 | + }) |
96 | 100 |
|
97 | | -it('validates field', () => { |
98 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
99 | | - const validator = (value: unknown) => (value === 1 ? null : 'Error!') |
100 | | - form.registerField('a.b.c', validator) |
101 | | - expect(form.validateField('a.b.c')).toBe(false) |
102 | | - expect(form.store.getState().errors['a.b.c']).toBe('Error!') |
103 | | - form.setFieldValue('a.b.c', 1) |
104 | | - expect(form.validateField('a.b.c')).toBe(true) |
105 | | - expect(form.store.getState().errors['a.b.c']).toBe(null) |
106 | | -}) |
| 101 | + it('validates field', () => { |
| 102 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 103 | + const validator = (value: unknown) => (value === 1 ? null : 'Error!') |
| 104 | + form.registerField('a.b.c', validator) |
| 105 | + expect(form.validateField('a.b.c')).toBe(false) |
| 106 | + expect(form.store.getState().errors['a.b.c']).toBe('Error!') |
| 107 | + form.setFieldValue('a.b.c', 1) |
| 108 | + expect(form.validateField('a.b.c')).toBe(true) |
| 109 | + expect(form.store.getState().errors['a.b.c']).toBe(null) |
| 110 | + }) |
107 | 111 |
|
108 | | -it('validates fields', () => { |
109 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
110 | | - const validator = (value: unknown) => (value === 1 ? null : 'Error!') |
111 | | - form.registerField('a.b.c', validator) |
112 | | - form.registerField('a.b.d', validator) |
113 | | - form.setFieldValue('a.b.c', 1) |
114 | | - expect(form.validateFields()).toBe(false) |
115 | | - expect(form.store.getState().errors['a.b.c']).toBe(null) |
116 | | - expect(form.store.getState().errors['a.b.d']).toBe('Error!') |
117 | | - form.setFieldValue('a.b.d', 1) |
118 | | - expect(form.validateFields()).toBe(true) |
119 | | - expect(form.store.getState().errors['a.b.c']).toBe(null) |
120 | | - expect(form.store.getState().errors['a.b.d']).toBe(null) |
121 | | -}) |
| 112 | + it('validates fields', () => { |
| 113 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 114 | + const validator = (value: unknown) => (value === 1 ? null : 'Error!') |
| 115 | + form.registerField('a.b.c', validator) |
| 116 | + form.registerField('a.b.d', validator) |
| 117 | + form.setFieldValue('a.b.c', 1) |
| 118 | + expect(form.validateFields()).toBe(false) |
| 119 | + expect(form.store.getState().errors['a.b.c']).toBe(null) |
| 120 | + expect(form.store.getState().errors['a.b.d']).toBe('Error!') |
| 121 | + form.setFieldValue('a.b.d', 1) |
| 122 | + expect(form.validateFields()).toBe(true) |
| 123 | + expect(form.store.getState().errors['a.b.c']).toBe(null) |
| 124 | + expect(form.store.getState().errors['a.b.d']).toBe(null) |
| 125 | + }) |
122 | 126 |
|
123 | | -it('skips calling listeners when batching', () => { |
124 | | - const form = new Formulier({initialValues: INITIAL_VALUES}) |
125 | | - const listener = vi.fn(() => undefined) |
126 | | - form.store.subscribe(listener) |
127 | | - expect(listener).toHaveBeenCalledTimes(0) |
128 | | - form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 1'}})) |
129 | | - form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 2'}})) |
130 | | - expect(listener).toHaveBeenCalledTimes(2) |
131 | | - form.store.batch(() => { |
132 | | - form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 3'}})) |
133 | | - form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 4'}})) |
| 127 | + it('skips calling listeners when batching', () => { |
| 128 | + const form = new Formulier({initialValues: INITIAL_VALUES}) |
| 129 | + const listener = vi.fn(() => undefined) |
| 130 | + form.store.subscribe(listener) |
| 131 | + expect(listener).toHaveBeenCalledTimes(0) |
| 132 | + form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 1'}})) |
| 133 | + form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 2'}})) |
| 134 | + expect(listener).toHaveBeenCalledTimes(2) |
| 135 | + form.store.batch(() => { |
| 136 | + form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 3'}})) |
| 137 | + form.store.setState(state => ({...state, errors: {'a.b.c': 'Error 4'}})) |
| 138 | + }) |
| 139 | + expect(listener).toHaveBeenCalledTimes(3) |
134 | 140 | }) |
135 | | - expect(listener).toHaveBeenCalledTimes(3) |
136 | 141 | }) |
0 commit comments