From 1a54ab231b9885e1778d56f3ce1ce79cc608616b Mon Sep 17 00:00:00 2001 From: Romain Hamel Date: Mon, 13 Jan 2025 11:19:29 +0100 Subject: [PATCH] refactor(Form): rename validation functions and vars for clarity (#3029) Co-authored-by: Benjamin Canac --- src/runtime/components/Form.vue | 13 +++++++------ src/runtime/types/form.ts | 6 +++--- src/runtime/utils/form.ts | 6 +++--- test/components/Form.spec.ts | 2 +- 4 files changed, 14 insertions(+), 13 deletions(-) diff --git a/src/runtime/components/Form.vue b/src/runtime/components/Form.vue index ee888590af..e573730bde 100644 --- a/src/runtime/components/Form.vue +++ b/src/runtime/components/Form.vue @@ -38,7 +38,7 @@ extendDevtoolsMeta({ example: 'FormExample' }) import { provide, inject, nextTick, ref, onUnmounted, onMounted, computed, useId, readonly } from 'vue' import { useEventBus } from '@vueuse/core' import { formOptionsInjectionKey, formInputsInjectionKey, formBusInjectionKey, formLoadingInjectionKey } from '../composables/useFormField' -import { parseSchema } from '../utils/form' +import { validateSchema } from '../utils/form' import { FormValidationException } from '../types/form' const props = withDefaults(defineProps>(), { @@ -104,16 +104,17 @@ function resolveErrorIds(errs: FormError[]): FormErrorWithId[] { })) } -const parsedValue = ref(null) +const transformedState = ref(null) + async function getErrors(): Promise { let errs = props.validate ? (await props.validate(props.state)) ?? [] : [] if (props.schema) { - const { errors, result } = await parseSchema(props.state, props.schema as FormSchema) + const { errors, result } = await validateSchema(props.state, props.schema as FormSchema) if (errors) { errs = errs.concat(errors) } else { - parsedValue.value = result + transformedState.value = result } } @@ -170,7 +171,7 @@ async function onSubmitWrapper(payload: Event) { try { await _validate({ nested: true }) - event.data = props.schema ? parsedValue.value : props.state + event.data = props.schema ? transformedState.value : props.state await props.onSubmit?.(event) } catch (error) { if (!(error instanceof FormValidationException)) { @@ -180,7 +181,7 @@ async function onSubmitWrapper(payload: Event) { const errorEvent: FormErrorEvent = { ...event, errors: error.errors, - childrens: error.childrens + children: error.children } emits('error', errorEvent) } diff --git a/src/runtime/types/form.ts b/src/runtime/types/form.ts index f18fa00b26..3d165e9166 100644 --- a/src/runtime/types/form.ts +++ b/src/runtime/types/form.ts @@ -43,7 +43,7 @@ export type FormSubmitEvent = SubmitEvent & { data: T } export type FormValidationError = { errors: FormErrorWithId[] - childrens: FormValidationError[] + children?: FormValidationError[] } export type FormErrorEvent = SubmitEvent & FormValidationError @@ -93,13 +93,13 @@ export interface ValidateReturnSchema { export class FormValidationException extends Error { formId: string | number errors: FormErrorWithId[] - childrens: FormValidationException[] + children?: FormValidationException[] constructor(formId: string | number, errors: FormErrorWithId[], childErrors: FormValidationException[]) { super('Form validation exception') this.formId = formId this.errors = errors - this.childrens = childErrors + this.children = childErrors Object.setPrototypeOf(this, FormValidationException.prototype) } } diff --git a/src/runtime/utils/form.ts b/src/runtime/utils/form.ts index 24504cc185..e2ba4329aa 100644 --- a/src/runtime/utils/form.ts +++ b/src/runtime/utils/form.ts @@ -43,7 +43,7 @@ export function isStandardSchema(schema: any): schema is StandardSchemaV1 { return '~standard' in schema } -export async function validateStandarSchema( +export async function validateStandardSchema( state: any, schema: StandardSchemaV1 ): Promise> { @@ -192,7 +192,7 @@ async function validateValibotSchema( } } -export function parseSchema(state: T, schema: FormSchema): Promise> { +export function validateSchema(state: T, schema: FormSchema): Promise> { if (isZodSchema(schema)) { return validateZodSchema(state, schema) } else if (isJoiSchema(schema)) { @@ -204,7 +204,7 @@ export function parseSchema(state: T, schema: FormSchema): } else if (isSuperStructSchema(schema)) { return validateSuperstructSchema(state, schema) } else if (isStandardSchema(schema)) { - return validateStandarSchema(state, schema) + return validateStandardSchema(state, schema) } else { throw new Error('Form validation failed: Unsupported form schema') } diff --git a/test/components/Form.spec.ts b/test/components/Form.spec.ts index ddc669e915..d1cfe58fe9 100644 --- a/test/components/Form.spec.ts +++ b/test/components/Form.spec.ts @@ -337,7 +337,7 @@ describe('Form', () => { expect(wrapper.setupState.onSubmit).not.toHaveBeenCalled() expect(wrapper.setupState.onError).toHaveBeenCalledTimes(1) const onErrorCallArgs = wrapper.setupState.onError.mock.lastCall[0] - expect(onErrorCallArgs.childrens[0].errors).toMatchObject([{ id: 'nestedInput', name: 'field', message: 'Required' }]) + expect(onErrorCallArgs.children[0].errors).toMatchObject([{ id: 'nestedInput', name: 'field', message: 'Required' }]) expect(onErrorCallArgs.errors).toMatchObject([ { id: 'emailInput', name: 'email', message: 'Required' }, { id: 'passwordInput', name: 'password', message: 'Required' }