feat(core): add more effects

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

@@ -24,9 +24,12 @@ import {
   onFormSubmitValidateFailed,
   onFormSubmitValidateStart,
   onFormSubmitValidateSuccess,
+  onFormSubmitValidateEnd,
   onFormUnMount,
   onFormValidateEnd,
   onFormValidateStart,
+  onFormValidateFailed,
+  onFormValidateSuccess,
   onFormValuesChange,
 } from '../'
 import { attach } from './shared'
@@ -124,3 +127,130 @@ test('onFormReact', () => {
   form.setValues({ aa: 123 })
   expect(react).toBeCalled()
 })
+
+test('onFormReset', async () => {
+  const reset = jest.fn()
+  const form = attach(
+    createForm({
+      initialValues: {
+        aa: 123,
+      },
+      effects() {
+        onFormReset(reset)
+      },
+    })
+  )
+
+  const field = attach(
+    form.createField({
+      name: 'aa',
+    })
+  )
+
+  field.setValue('xxxx')
+
+  expect(field.value).toEqual('xxxx')
+  expect(form.values.aa).toEqual('xxxx')
+  expect(reset).not.toBeCalled()
+  await form.reset()
+  expect(field.value).toEqual(123)
+  expect(form.values.aa).toEqual(123)
+  expect(reset).toBeCalled()
+})
+
+test('onFormSubmit', async () => {
+  const submit = jest.fn()
+  const submitStart = jest.fn()
+  const submitEnd = jest.fn()
+  const submitSuccess = jest.fn()
+  const submitFailed = jest.fn()
+  const submitValidateStart = jest.fn()
+  const submitValidateFailed = jest.fn()
+  const submitValidateSuccess = jest.fn()
+  const submitValidateEnd = jest.fn()
+  const form = attach(
+    createForm({
+      effects() {
+        onFormSubmitStart(submitStart)
+        onFormSubmit(submit)
+        onFormSubmitEnd(submitEnd)
+        onFormSubmitFailed(submitFailed)
+        onFormSubmitSuccess(submitSuccess)
+        onFormSubmitValidateStart(submitValidateStart)
+        onFormSubmitValidateFailed(submitValidateFailed)
+        onFormSubmitValidateSuccess(submitValidateSuccess)
+        onFormSubmitValidateEnd(submitValidateEnd)
+      },
+    })
+  )
+
+  const field = attach(
+    form.createField({
+      name: 'aa',
+      required: true,
+    })
+  )
+  try {
+    await form.submit()
+  } catch {}
+  expect(submitStart).toBeCalled()
+  expect(submit).toBeCalled()
+  expect(submitEnd).toBeCalled()
+  expect(submitSuccess).not.toBeCalled()
+  expect(submitFailed).toBeCalled()
+  expect(submitValidateStart).toBeCalled()
+  expect(submitValidateFailed).toBeCalled()
+  expect(submitValidateSuccess).not.toBeCalled()
+  expect(submitValidateEnd).toBeCalled()
+  field.onInput('123')
+  try {
+    await form.submit()
+  } catch (e) {}
+  expect(submitStart).toBeCalledTimes(2)
+  expect(submit).toBeCalledTimes(2)
+  expect(submitEnd).toBeCalledTimes(2)
+  expect(submitSuccess).toBeCalledTimes(1)
+  expect(submitFailed).toBeCalledTimes(1)
+  expect(submitValidateStart).toBeCalledTimes(2)
+  expect(submitValidateFailed).toBeCalledTimes(1)
+  expect(submitValidateSuccess).toBeCalledTimes(1)
+  expect(submitValidateEnd).toBeCalledTimes(2)
+})
+
+test('onFormValidate', async () => {
+  const validateStart = jest.fn()
+  const validateEnd = jest.fn()
+  const validateFailed = jest.fn()
+  const validateSuccess = jest.fn()
+  const form = attach(
+    createForm({
+      effects() {
+        onFormValidateStart(validateStart)
+        onFormValidateEnd(validateEnd)
+        onFormValidateFailed(validateFailed)
+        onFormValidateSuccess(validateSuccess)
+      },
+    })
+  )
+  const field = attach(
+    form.createField({
+      name: 'aa',
+      required: true,
+    })
+  )
+  try {
+    await form.validate()
+  } catch {}
+  expect(validateStart).toBeCalled()
+  expect(validateEnd).toBeCalled()
+  expect(validateFailed).toBeCalled()
+  expect(validateSuccess).not.toBeCalled()
+  field.onInput('123')
+  try {
+    await form.validate()
+  } catch {}
+  expect(validateStart).toBeCalledTimes(2)
+  expect(validateEnd).toBeCalledTimes(2)
+  expect(validateFailed).toBeCalledTimes(1)
+  expect(validateSuccess).toBeCalledTimes(1)
+})

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

@@ -3,13 +3,13 @@ import { attach } from './shared'
 
 test('create object field', () => {
   const form = attach(createForm())
-  const array = attach(
+  const object = attach(
     form.createObjectField({
       name: 'object',
     })
   )
-  expect(array.value).toEqual({})
-  expect(array.addProperty).toBeDefined()
-  expect(array.removeProperty).toBeDefined()
-  expect(array.existProperty).toBeDefined()
+  expect(object.value).toEqual({})
+  expect(object.addProperty).toBeDefined()
+  expect(object.removeProperty).toBeDefined()
+  expect(object.existProperty).toBeDefined()
 })

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

@@ -0,0 +1,11 @@
+import { createForm } from '../'
+import { attach } from './shared'
+
+test('create object field', () => {
+  const form = attach(createForm())
+  attach(
+    form.createVoidField({
+      name: 'void',
+    })
+  )
+})

packages/core/src/effects/onFieldEffects.ts

@@ -47,7 +47,12 @@ export const onFieldValidateStart = createFieldEffect(
 export const onFieldValidateEnd = createFieldEffect(
   LifeCycleTypes.ON_FIELD_VALIDATE_END
 )
-
+export const onFieldValidateFailed = createFieldEffect(
+  LifeCycleTypes.ON_FIELD_VALIDATE_FAILED
+)
+export const onFieldValidateSuccess = createFieldEffect(
+  LifeCycleTypes.ON_FIELD_VALIDATE_SUCCESS
+)
 export function onFieldReact(
   pattern: FormPathPattern,
   callback?: (field: GeneralField, form: Form) => void
@@ -93,4 +98,4 @@ export function onFieldChange(
       dispose()
     })
   })
-}
+}

packages/core/src/effects/onFormEffects.ts

@@ -52,9 +52,18 @@ export const onFormSubmitValidateSuccess = createFormEffect(
 export const onFormSubmitValidateFailed = createFormEffect(
   LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_FAILED
 )
+export const onFormSubmitValidateEnd = createFormEffect(
+  LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_END
+)
 export const onFormValidateStart = createFormEffect(
   LifeCycleTypes.ON_FORM_VALIDATE_START
 )
+export const onFormValidateSuccess = createFormEffect(
+  LifeCycleTypes.ON_FORM_VALIDATE_SUCCESS
+)
+export const onFormValidateFailed = createFormEffect(
+  LifeCycleTypes.ON_FORM_VALIDATE_FAILED
+)
 export const onFormValidateEnd = createFormEffect(
   LifeCycleTypes.ON_FORM_VALIDATE_END
 )

packages/core/src/models/Field.ts

@@ -215,6 +215,18 @@ export class Field<
 
   protected makeReactive() {
     this.disposers.push(
+      reaction(
+        () => this.value,
+        () => {
+          this.form.notify(LifeCycleTypes.ON_FIELD_VALUE_CHANGE, this)
+        }
+      ),
+      reaction(
+        () => this.initialValue,
+        () => {
+          this.form.notify(LifeCycleTypes.ON_FIELD_INITIAL_VALUE_CHANGE, this)
+        }
+      ),
       reaction(
         () => this.display,
         (display) => {
@@ -670,6 +682,11 @@ export class Field<
     this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_START, this)
     const results = await validateToFeedbacks(this, triggerType)
     this.setValidating(false)
+    if (this.valid) {
+      this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_SUCCESS, this)
+    } else {
+      this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_FAILED, this)
+    }
     this.form.notify(LifeCycleTypes.ON_FIELD_VALIDATE_END, this)
     return results
   }

packages/core/src/models/Form.ts

@@ -507,40 +507,50 @@ export class Form {
     })
     await Promise.all(tasks)
     this.setValidating(false)
-    this.notify(LifeCycleTypes.ON_FORM_VALIDATE_END)
     if (this.invalid) {
+      this.notify(LifeCycleTypes.ON_FORM_VALIDATE_FAILED)
+      this.notify(LifeCycleTypes.ON_FORM_VALIDATE_END)
       throw this.errors
     }
+    this.notify(LifeCycleTypes.ON_FORM_VALIDATE_SUCCESS)
+    this.notify(LifeCycleTypes.ON_FORM_VALIDATE_END)
   }
 
   submit = async <T>(
     onSubmit?: (values: any) => Promise<T> | void
   ): Promise<T> => {
     this.setSubmitting(true)
     try {
+      this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_START)
       await this.validate()
       this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_SUCCESS)
     } catch (e) {
       this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_FAILED)
     }
+    this.notify(LifeCycleTypes.ON_FORM_SUBMIT_VALIDATE_END)
     let results: any
     try {
       if (isFn(onSubmit) && this.valid) {
         results = await onSubmit(toJS(this.values))
-        this.notify(LifeCycleTypes.ON_FORM_SUBMIT_SUCCESS)
       } else if (this.invalid) {
         throw this.errors
       }
+      this.notify(LifeCycleTypes.ON_FORM_SUBMIT_SUCCESS)
     } catch (e) {
-      this.notify(LifeCycleTypes.ON_FORM_SUBMIT_FAILED)
       this.setSubmitting(false)
+      this.notify(LifeCycleTypes.ON_FORM_SUBMIT_FAILED)
+      this.notify(LifeCycleTypes.ON_FORM_SUBMIT)
       throw e
     }
     this.setSubmitting(false)
+    this.notify(LifeCycleTypes.ON_FORM_SUBMIT)
     return results
   }
 
-  reset = async (pattern: FormPathPattern, options?: IFieldResetOptions) => {
+  reset = async (
+    pattern: FormPathPattern = '*',
+    options?: IFieldResetOptions
+  ) => {
     const tasks = []
     this.query(pattern).all.getAll((field) => {
       if (!isVoidField(field)) {

packages/core/src/types.ts

@@ -47,11 +47,14 @@ export enum LifeCycleTypes {
   ON_FORM_SUBMIT_VALIDATE_START = 'onFormSubmitValidateStart',
   ON_FORM_SUBMIT_VALIDATE_SUCCESS = 'onFormSubmitValidateSuccess',
   ON_FORM_SUBMIT_VALIDATE_FAILED = 'onFormSubmitValidateFailed',
+  ON_FORM_SUBMIT_VALIDATE_END = 'onFormSubmitValidateEnd',
   ON_FORM_SUBMIT_SUCCESS = 'onFormSubmitSuccess',
   ON_FORM_SUBMIT_FAILED = 'onFormSubmitFailed',
   ON_FORM_VALUES_CHANGE = 'onFormValuesChange',
   ON_FORM_INITIAL_VALUES_CHANGE = 'onFormInitialValuesChange',
   ON_FORM_VALIDATE_START = 'onFormValidateStart',
+  ON_FORM_VALIDATE_SUCCESS = 'onFormValidateSuccess',
+  ON_FORM_VALIDATE_FAILED = 'onFormValidateFailed',
   ON_FORM_VALIDATE_END = 'onFormValidateEnd',
   ON_FORM_INPUT_CHANGE = 'onFormInputChange',
 
@@ -66,6 +69,8 @@ export enum LifeCycleTypes {
   ON_FIELD_VALUE_CHANGE = 'onFieldValueChange',
   ON_FIELD_INITIAL_VALUE_CHANGE = 'onFieldInitialValueChange',
   ON_FIELD_VALIDATE_START = 'onFieldValidateStart',
+  ON_FIELD_VALIDATE_SUCCESS = 'onFieldValidateSuccess',
+  ON_FIELD_VALIDATE_FAILED = 'onFieldValidateFailed',
   ON_FIELD_VALIDATE_END = 'onFieldValidateEnd',
   ON_FIELD_RESET = 'onFieldReset',
   ON_FIELD_MOUNT = 'onFieldMount',

packages/core/tsconfig.json

@@ -1,13 +1,15 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-      "outDir": "./lib"
+    "outDir": "./lib"
   },
   "include": [
-      "./src/**/*.ts",
-      "./src/**/*.tsx",
+    "./src/**/*.ts",
+    "./src/**/*.tsx",
   ],
   "exclude": [
-    "./src/__tests__/*"
+    "./src/__tests__/*",
+    "./esm/*",
+    "./lib/*",
   ]
-}
+}

packages/shared/package.json

@@ -36,7 +36,6 @@
 		"cool-path": "^1.0.0",
 		"lower-case": "^2.0.1",
 		"pascal-case": "^3.1.1",
-		"scheduler": "^0.19.0",
 		"upper-case": "^2.0.1"
 	}
 }