Skip to content

Commit 5b42226

Browse files
committed
feat(core): add more effects
1 parent c523604 commit 5b42226

File tree

17 files changed

+345
-166
lines changed

17 files changed

+345
-166
lines changed

packages/core/src/__tests__/effects.spec.ts

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,12 @@ import {
2424
onFormSubmitValidateFailed,
2525
onFormSubmitValidateStart,
2626
onFormSubmitValidateSuccess,
27+
onFormSubmitValidateEnd,
2728
onFormUnMount,
2829
onFormValidateEnd,
2930
onFormValidateStart,
31+
onFormValidateFailed,
32+
onFormValidateSuccess,
3033
onFormValuesChange,
3134
} from '../'
3235
import { attach } from './shared'
@@ -124,3 +127,130 @@ test('onFormReact', () => {
124127
form.setValues({ aa: 123 })
125128
expect(react).toBeCalled()
126129
})
130+
131+
test('onFormReset', async () => {
132+
const reset = jest.fn()
133+
const form = attach(
134+
createForm({
135+
initialValues: {
136+
aa: 123,
137+
},
138+
effects() {
139+
onFormReset(reset)
140+
},
141+
})
142+
)
143+
144+
const field = attach(
145+
form.createField({
146+
name: 'aa',
147+
})
148+
)
149+
150+
field.setValue('xxxx')
151+
152+
expect(field.value).toEqual('xxxx')
153+
expect(form.values.aa).toEqual('xxxx')
154+
expect(reset).not.toBeCalled()
155+
await form.reset()
156+
expect(field.value).toEqual(123)
157+
expect(form.values.aa).toEqual(123)
158+
expect(reset).toBeCalled()
159+
})
160+
161+
test('onFormSubmit', async () => {
162+
const submit = jest.fn()
163+
const submitStart = jest.fn()
164+
const submitEnd = jest.fn()
165+
const submitSuccess = jest.fn()
166+
const submitFailed = jest.fn()
167+
const submitValidateStart = jest.fn()
168+
const submitValidateFailed = jest.fn()
169+
const submitValidateSuccess = jest.fn()
170+
const submitValidateEnd = jest.fn()
171+
const form = attach(
172+
createForm({
173+
effects() {
174+
onFormSubmitStart(submitStart)
175+
onFormSubmit(submit)
176+
onFormSubmitEnd(submitEnd)
177+
onFormSubmitFailed(submitFailed)
178+
onFormSubmitSuccess(submitSuccess)
179+
onFormSubmitValidateStart(submitValidateStart)
180+
onFormSubmitValidateFailed(submitValidateFailed)
181+
onFormSubmitValidateSuccess(submitValidateSuccess)
182+
onFormSubmitValidateEnd(submitValidateEnd)
183+
},
184+
})
185+
)
186+
187+
const field = attach(
188+
form.createField({
189+
name: 'aa',
190+
required: true,
191+
})
192+
)
193+
try {
194+
await form.submit()
195+
} catch {}
196+
expect(submitStart).toBeCalled()
197+
expect(submit).toBeCalled()
198+
expect(submitEnd).toBeCalled()
199+
expect(submitSuccess).not.toBeCalled()
200+
expect(submitFailed).toBeCalled()
201+
expect(submitValidateStart).toBeCalled()
202+
expect(submitValidateFailed).toBeCalled()
203+
expect(submitValidateSuccess).not.toBeCalled()
204+
expect(submitValidateEnd).toBeCalled()
205+
field.onInput('123')
206+
try {
207+
await form.submit()
208+
} catch (e) {}
209+
expect(submitStart).toBeCalledTimes(2)
210+
expect(submit).toBeCalledTimes(2)
211+
expect(submitEnd).toBeCalledTimes(2)
212+
expect(submitSuccess).toBeCalledTimes(1)
213+
expect(submitFailed).toBeCalledTimes(1)
214+
expect(submitValidateStart).toBeCalledTimes(2)
215+
expect(submitValidateFailed).toBeCalledTimes(1)
216+
expect(submitValidateSuccess).toBeCalledTimes(1)
217+
expect(submitValidateEnd).toBeCalledTimes(2)
218+
})
219+
220+
test('onFormValidate', async () => {
221+
const validateStart = jest.fn()
222+
const validateEnd = jest.fn()
223+
const validateFailed = jest.fn()
224+
const validateSuccess = jest.fn()
225+
const form = attach(
226+
createForm({
227+
effects() {
228+
onFormValidateStart(validateStart)
229+
onFormValidateEnd(validateEnd)
230+
onFormValidateFailed(validateFailed)
231+
onFormValidateSuccess(validateSuccess)
232+
},
233+
})
234+
)
235+
const field = attach(
236+
form.createField({
237+
name: 'aa',
238+
required: true,
239+
})
240+
)
241+
try {
242+
await form.validate()
243+
} catch {}
244+
expect(validateStart).toBeCalled()
245+
expect(validateEnd).toBeCalled()
246+
expect(validateFailed).toBeCalled()
247+
expect(validateSuccess).not.toBeCalled()
248+
field.onInput('123')
249+
try {
250+
await form.validate()
251+
} catch {}
252+
expect(validateStart).toBeCalledTimes(2)
253+
expect(validateEnd).toBeCalledTimes(2)
254+
expect(validateFailed).toBeCalledTimes(1)
255+
expect(validateSuccess).toBeCalledTimes(1)
256+
})

packages/core/src/__tests__/object.spec.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@ import { attach } from './shared'
33

44
test('create object field', () => {
55
const form = attach(createForm())
6-
const array = attach(
6+
const object = attach(
77
form.createObjectField({
88
name: 'object',
99
})
1010
)
11-
expect(array.value).toEqual({})
12-
expect(array.addProperty).toBeDefined()
13-
expect(array.removeProperty).toBeDefined()
14-
expect(array.existProperty).toBeDefined()
11+
expect(object.value).toEqual({})
12+
expect(object.addProperty).toBeDefined()
13+
expect(object.removeProperty).toBeDefined()
14+
expect(object.existProperty).toBeDefined()
1515
})
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { createForm } from '../'
2+
import { attach } from './shared'
3+
4+
test('create object field', () => {
5+
const form = attach(createForm())
6+
attach(
7+
form.createVoidField({
8+
name: 'void',
9+
})
10+
)
11+
})

packages/core/src/effects/onFieldEffects.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,12 @@ export const onFieldValidateStart = createFieldEffect(
4747
export const onFieldValidateEnd = createFieldEffect(
4848
LifeCycleTypes.ON_FIELD_VALIDATE_END
4949
)
50-
50+
export const onFieldValidateFailed = createFieldEffect(
51+
LifeCycleTypes.ON_FIELD_VALIDATE_FAILED
52+
)
53+
export const onFieldValidateSuccess = createFieldEffect(
54+
LifeCycleTypes.ON_FIELD_VALIDATE_SUCCESS
55+
)
5156
export function onFieldReact(
5257
pattern: FormPathPattern,
5358
callback?: (field: GeneralField, form: Form) => void
@@ -93,4 +98,4 @@ export function onFieldChange(
9398
dispose()
9499
})
95100
})
96-
}
101+
}

packages/core/src/effects/onFormEffects.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,18 @@ export const onFormSubmitValidateSuccess = createFormEffect(
5252
export const onFormSubmitValidateFailed = createFormEffect(
5353
LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_FAILED
5454
)
55+
export const onFormSubmitValidateEnd = createFormEffect(
56+
LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_END
57+
)
5558
export const onFormValidateStart = createFormEffect(
5659
LifeCycleTypes.ON_FORM_VALIDATE_START
5760
)
61+
export const onFormValidateSuccess = createFormEffect(
62+
LifeCycleTypes.ON_FORM_VALIDATE_SUCCESS
63+
)
64+
export const onFormValidateFailed = createFormEffect(
65+
LifeCycleTypes.ON_FORM_VALIDATE_FAILED
66+
)
5867
export const onFormValidateEnd = createFormEffect(
5968
LifeCycleTypes.ON_FORM_VALIDATE_END
6069
)

packages/core/src/models/Field.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -215,6 +215,18 @@ export class Field<
215215

216216
protected makeReactive() {
217217
this.disposers.push(
218+
reaction(
219+
() => this.value,
220+
() => {
221+
this.form.notify(LifeCycleTypes.ON_FIELD_VALUE_CHANGE, this)
222+
}
223+
),
224+
reaction(
225+
() => this.initialValue,
226+
() => {
227+
this.form.notify(LifeCycleTypes.ON_FIELD_INITIAL_VALUE_CHANGE, this)
228+
}
229+
),
218230
reaction(
219231
() => this.display,
220232
(display) => {
@@ -670,6 +682,11 @@ export class Field<
670682
this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_START, this)
671683
const results = await validateToFeedbacks(this, triggerType)
672684
this.setValidating(false)
685+
if (this.valid) {
686+
this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_SUCCESS, this)
687+
} else {
688+
this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_FAILED, this)
689+
}
673690
this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_END, this)
674691
return results
675692
}

packages/core/src/models/Form.ts

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -507,40 +507,50 @@ export class Form {
507507
})
508508
await Promise.all(tasks)
509509
this.setValidating(false)
510-
this.notify(LifeCycleTypes.ON_FORM_VALIDATE_END)
511510
if (this.invalid) {
511+
this.notify(LifeCycleTypes.ON_FORM_VALIDATE_FAILED)
512+
this.notify(LifeCycleTypes.ON_FORM_VALIDATE_END)
512513
throw this.errors
513514
}
515+
this.notify(LifeCycleTypes.ON_FORM_VALIDATE_SUCCESS)
516+
this.notify(LifeCycleTypes.ON_FORM_VALIDATE_END)
514517
}
515518

516519
submit = async <T>(
517520
onSubmit?: (values: any) => Promise<T> | void
518521
): Promise<T> => {
519522
this.setSubmitting(true)
520523
try {
524+
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_START)
521525
await this.validate()
522526
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_SUCCESS)
523527
} catch (e) {
524528
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_FAILED)
525529
}
530+
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_END)
526531
let results: any
527532
try {
528533
if (isFn(onSubmit) && this.valid) {
529534
results = await onSubmit(toJS(this.values))
530-
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_SUCCESS)
531535
} else if (this.invalid) {
532536
throw this.errors
533537
}
538+
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_SUCCESS)
534539
} catch (e) {
535-
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_FAILED)
536540
this.setSubmitting(false)
541+
this.notify(LifeCycleTypes.ON_FORM_SUBMIT_FAILED)
542+
this.notify(LifeCycleTypes.ON_FORM_SUBMIT)
537543
throw e
538544
}
539545
this.setSubmitting(false)
546+
this.notify(LifeCycleTypes.ON_FORM_SUBMIT)
540547
return results
541548
}
542549

543-
reset = async (pattern: FormPathPattern, options?: IFieldResetOptions) => {
550+
reset = async (
551+
pattern: FormPathPattern = '*',
552+
options?: IFieldResetOptions
553+
) => {
544554
const tasks = []
545555
this.query(pattern).all.getAll((field) => {
546556
if (!isVoidField(field)) {

packages/core/src/types.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,11 +47,14 @@ export enum LifeCycleTypes {
4747
ON_FORM_SUBMIT_VALIDATE_START = 'onFormSubmitValidateStart',
4848
ON_FORM_SUBMIT_VALIDATE_SUCCESS = 'onFormSubmitValidateSuccess',
4949
ON_FORM_SUBMIT_VALIDATE_FAILED = 'onFormSubmitValidateFailed',
50+
ON_FORM_SUBMIT_VALIDATE_END = 'onFormSubmitValidateEnd',
5051
ON_FORM_SUBMIT_SUCCESS = 'onFormSubmitSuccess',
5152
ON_FORM_SUBMIT_FAILED = 'onFormSubmitFailed',
5253
ON_FORM_VALUES_CHANGE = 'onFormValuesChange',
5354
ON_FORM_INITIAL_VALUES_CHANGE = 'onFormInitialValuesChange',
5455
ON_FORM_VALIDATE_START = 'onFormValidateStart',
56+
ON_FORM_VALIDATE_SUCCESS = 'onFormValidateSuccess',
57+
ON_FORM_VALIDATE_FAILED = 'onFormValidateFailed',
5558
ON_FORM_VALIDATE_END = 'onFormValidateEnd',
5659
ON_FORM_INPUT_CHANGE = 'onFormInputChange',
5760

@@ -66,6 +69,8 @@ export enum LifeCycleTypes {
6669
ON_FIELD_VALUE_CHANGE = 'onFieldValueChange',
6770
ON_FIELD_INITIAL_VALUE_CHANGE = 'onFieldInitialValueChange',
6871
ON_FIELD_VALIDATE_START = 'onFieldValidateStart',
72+
ON_FIELD_VALIDATE_SUCCESS = 'onFieldValidateSuccess',
73+
ON_FIELD_VALIDATE_FAILED = 'onFieldValidateFailed',
6974
ON_FIELD_VALIDATE_END = 'onFieldValidateEnd',
7075
ON_FIELD_RESET = 'onFieldReset',
7176
ON_FIELD_MOUNT = 'onFieldMount',

packages/core/tsconfig.json

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
11
{
22
"extends": "../../tsconfig.json",
33
"compilerOptions": {
4-
"outDir": "./lib"
4+
"outDir": "./lib"
55
},
66
"include": [
7-
"./src/**/*.ts",
8-
"./src/**/*.tsx",
7+
"./src/**/*.ts",
8+
"./src/**/*.tsx",
99
],
1010
"exclude": [
11-
"./src/__tests__/*"
11+
"./src/__tests__/*",
12+
"./esm/*",
13+
"./lib/*",
1214
]
13-
}
15+
}

packages/shared/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,6 @@
3636
"cool-path": "^1.0.0",
3737
"lower-case": "^2.0.1",
3838
"pascal-case": "^3.1.1",
39-
"scheduler": "^0.19.0",
4039
"upper-case": "^2.0.1"
4140
}
4241
}

0 commit comments

Comments
 (0)