From ee9a7e6ec32ba63b830cbe901885df688bfacbba Mon Sep 17 00:00:00 2001 From: Keaton Roux Date: Wed, 18 Dec 2024 15:07:32 +0200 Subject: [PATCH 1/2] fix: errors not resetting once values are correct --- packages/form-core/src/FormApi.ts | 41 +++++++++++++++++ .../zod-form-adapter/tests/FormApi.spec.ts | 46 +++++++++++++++++++ 2 files changed, 87 insertions(+) diff --git a/packages/form-core/src/FormApi.ts b/packages/form-core/src/FormApi.ts index af0190c28..579fc18cf 100644 --- a/packages/form-core/src/FormApi.ts +++ b/packages/form-core/src/FormApi.ts @@ -747,6 +747,26 @@ export class FormApi< })) } } + } else { + for (const [field] of Object.entries(this.fieldInfo)) { + this.setFieldMeta(field as DeepKeys, (prev) => { + const newErrorMap = prev.errorMap; + + if (prev.isDirty) { + for (const [errorKey] of Object.entries(prev.errorMap)) { + newErrorMap[errorKey as ValidationErrorMapKeys] = undefined + } + } + + return { + ...prev, + errorMap: { + ...prev.errorMap, + [errorMapKey]: undefined, + }, + } + }) + } } if (this.state.errorMap[errorMapKey] !== formError) { @@ -875,7 +895,28 @@ export class FormApi< })) } } + } else { + for (const [field] of Object.entries(this.fieldInfo)) { + this.setFieldMeta(field as DeepKeys, (prev) => { + const newErrorMap = prev.errorMap; + + if (prev.isDirty) { + for (const [errorKey] of Object.entries(prev.errorMap)) { + newErrorMap[errorKey as ValidationErrorMapKeys] = undefined + } + } + + return { + ...prev, + errorMap: { + ...prev.errorMap, + [errorMapKey]: undefined, + }, + } + }) + } } + this.store.setState((prev) => ({ ...prev, errorMap: { diff --git a/packages/zod-form-adapter/tests/FormApi.spec.ts b/packages/zod-form-adapter/tests/FormApi.spec.ts index d2ff390ba..c0f54f92d 100644 --- a/packages/zod-form-adapter/tests/FormApi.spec.ts +++ b/packages/zod-form-adapter/tests/FormApi.spec.ts @@ -184,4 +184,50 @@ describe('zod form api', () => { name0Field.setValue('qwer') expect(name0Field.getMeta().errors).toEqual([]) }) + + it('should clear errors if previously errors were set and now are fixed', () => { + const form = new FormApi({ + defaultValues: { + password: '', + confirmPassword: '', + }, + validatorAdapter: zodValidator(), + validators: { + onChange: z.object({ + password: z.string(), + confirmPassword: z.string(), + }).refine(({ password, confirmPassword }) => password === confirmPassword, { + message: 'Passwords must match', + path: ['password'], + }) + } + }); + form.mount(); + + const field1 = new FieldApi({ + form, + name: 'password', + defaultMeta: { + isTouched: true, + }, + }); + field1.mount(); + + const field2 = new FieldApi({ + form, + name: 'confirmPassword', + defaultMeta: { + isTouched: true, + }, + }); + field2.mount(); + + field1.setValue('password'); + expect(field1.getMeta().errors).toStrictEqual(['Passwords must match']); + expect(form.state.canSubmit).toBe(false); + + field2.setValue('password'); + expect(field2.getMeta().errors).toStrictEqual([]); + expect(form.state.canSubmit).toBe(true); + }) }) From 36ca7999ca6bd4ddd0737eb6fab84a7aeb9fedf6 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Sat, 21 Dec 2024 16:46:14 +0000 Subject: [PATCH 2/2] ci: apply automated fixes and generate docs --- docs/reference/classes/formapi.md | 30 ++++++------- packages/form-core/src/FormApi.ts | 4 +- .../zod-form-adapter/tests/FormApi.spec.ts | 45 ++++++++++--------- 3 files changed, 42 insertions(+), 37 deletions(-) diff --git a/docs/reference/classes/formapi.md b/docs/reference/classes/formapi.md index b83a304bc..93037ccd7 100644 --- a/docs/reference/classes/formapi.md +++ b/docs/reference/classes/formapi.md @@ -125,7 +125,7 @@ deleteField(field): void #### Defined in -[packages/form-core/src/FormApi.ts:1109](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1109) +[packages/form-core/src/FormApi.ts:1150](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1150) *** @@ -153,7 +153,7 @@ Gets the field info of the specified field. #### Defined in -[packages/form-core/src/FormApi.ts:1021](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1021) +[packages/form-core/src/FormApi.ts:1062](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1062) *** @@ -181,7 +181,7 @@ Gets the metadata of the specified field. #### Defined in -[packages/form-core/src/FormApi.ts:1012](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1012) +[packages/form-core/src/FormApi.ts:1053](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1053) *** @@ -209,7 +209,7 @@ Gets the value of the specified field. #### Defined in -[packages/form-core/src/FormApi.ts:1005](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1005) +[packages/form-core/src/FormApi.ts:1046](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1046) *** @@ -227,7 +227,7 @@ Handles the form submission, performs validation, and calls the appropriate onSu #### Defined in -[packages/form-core/src/FormApi.ts:946](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L946) +[packages/form-core/src/FormApi.ts:987](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L987) *** @@ -271,7 +271,7 @@ Inserts a value into an array field at the specified index, shifting the subsequ #### Defined in -[packages/form-core/src/FormApi.ts:1141](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1141) +[packages/form-core/src/FormApi.ts:1182](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1182) *** @@ -331,7 +331,7 @@ Moves the value at the first specified index to the second specified index withi #### Defined in -[packages/form-core/src/FormApi.ts:1259](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1259) +[packages/form-core/src/FormApi.ts:1300](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1300) *** @@ -370,7 +370,7 @@ Pushes a value into an array field. #### Defined in -[packages/form-core/src/FormApi.ts:1123](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1123) +[packages/form-core/src/FormApi.ts:1164](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1164) *** @@ -409,7 +409,7 @@ Removes a value from an array field at the specified index. #### Defined in -[packages/form-core/src/FormApi.ts:1194](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1194) +[packages/form-core/src/FormApi.ts:1235](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1235) *** @@ -453,7 +453,7 @@ Replaces a value into an array field at the specified index. #### Defined in -[packages/form-core/src/FormApi.ts:1168](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1168) +[packages/form-core/src/FormApi.ts:1209](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1209) *** @@ -514,7 +514,7 @@ resetFieldMeta(fieldMeta): Record #### Defined in -[packages/form-core/src/FormApi.ts:1055](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1055) +[packages/form-core/src/FormApi.ts:1096](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1096) *** @@ -538,7 +538,7 @@ Updates the form's errorMap #### Defined in -[packages/form-core/src/FormApi.ts:1283](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1283) +[packages/form-core/src/FormApi.ts:1324](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1324) *** @@ -570,7 +570,7 @@ Updates the metadata of the specified field. #### Defined in -[packages/form-core/src/FormApi.ts:1040](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1040) +[packages/form-core/src/FormApi.ts:1081](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1081) *** @@ -609,7 +609,7 @@ Sets the value of the specified field and optionally updates the touched state. #### Defined in -[packages/form-core/src/FormApi.ts:1079](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1079) +[packages/form-core/src/FormApi.ts:1120](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1120) *** @@ -653,7 +653,7 @@ Swaps the values at the specified indices within an array field. #### Defined in -[packages/form-core/src/FormApi.ts:1233](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1233) +[packages/form-core/src/FormApi.ts:1274](https://github.com/TanStack/form/blob/main/packages/form-core/src/FormApi.ts#L1274) *** diff --git a/packages/form-core/src/FormApi.ts b/packages/form-core/src/FormApi.ts index 579fc18cf..651e679ce 100644 --- a/packages/form-core/src/FormApi.ts +++ b/packages/form-core/src/FormApi.ts @@ -750,7 +750,7 @@ export class FormApi< } else { for (const [field] of Object.entries(this.fieldInfo)) { this.setFieldMeta(field as DeepKeys, (prev) => { - const newErrorMap = prev.errorMap; + const newErrorMap = prev.errorMap if (prev.isDirty) { for (const [errorKey] of Object.entries(prev.errorMap)) { @@ -898,7 +898,7 @@ export class FormApi< } else { for (const [field] of Object.entries(this.fieldInfo)) { this.setFieldMeta(field as DeepKeys, (prev) => { - const newErrorMap = prev.errorMap; + const newErrorMap = prev.errorMap if (prev.isDirty) { for (const [errorKey] of Object.entries(prev.errorMap)) { diff --git a/packages/zod-form-adapter/tests/FormApi.spec.ts b/packages/zod-form-adapter/tests/FormApi.spec.ts index c0f54f92d..d791bbae2 100644 --- a/packages/zod-form-adapter/tests/FormApi.spec.ts +++ b/packages/zod-form-adapter/tests/FormApi.spec.ts @@ -193,16 +193,21 @@ describe('zod form api', () => { }, validatorAdapter: zodValidator(), validators: { - onChange: z.object({ - password: z.string(), - confirmPassword: z.string(), - }).refine(({ password, confirmPassword }) => password === confirmPassword, { - message: 'Passwords must match', - path: ['password'], - }) - } - }); - form.mount(); + onChange: z + .object({ + password: z.string(), + confirmPassword: z.string(), + }) + .refine( + ({ password, confirmPassword }) => password === confirmPassword, + { + message: 'Passwords must match', + path: ['password'], + }, + ), + }, + }) + form.mount() const field1 = new FieldApi({ form, @@ -210,8 +215,8 @@ describe('zod form api', () => { defaultMeta: { isTouched: true, }, - }); - field1.mount(); + }) + field1.mount() const field2 = new FieldApi({ form, @@ -219,15 +224,15 @@ describe('zod form api', () => { defaultMeta: { isTouched: true, }, - }); - field2.mount(); + }) + field2.mount() - field1.setValue('password'); - expect(field1.getMeta().errors).toStrictEqual(['Passwords must match']); - expect(form.state.canSubmit).toBe(false); + field1.setValue('password') + expect(field1.getMeta().errors).toStrictEqual(['Passwords must match']) + expect(form.state.canSubmit).toBe(false) - field2.setValue('password'); - expect(field2.getMeta().errors).toStrictEqual([]); - expect(form.state.canSubmit).toBe(true); + field2.setValue('password') + expect(field2.getMeta().errors).toStrictEqual([]) + expect(form.state.canSubmit).toBe(true) }) })