Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
fix: re-introduce the errors prop back on the form validation result c…
…loses #3317
  • Loading branch information
logaretm committed May 24, 2021
1 parent abeccfb commit b439a73
Show file tree
Hide file tree
Showing 4 changed files with 53 additions and 26 deletions.
1 change: 1 addition & 0 deletions packages/vee-validate/src/types.ts
Expand Up @@ -95,6 +95,7 @@ export interface FormActions<TValues extends Record<string, unknown>> {
export interface FormValidationResult<TValues> {
valid: boolean;
results: Partial<Record<keyof TValues, ValidationResult>>;
errors: Partial<Record<keyof TValues, string>>;
}

export interface SubmissionContext<TValues extends Record<string, unknown> = Record<string, unknown>>
Expand Down
34 changes: 22 additions & 12 deletions packages/vee-validate/src/useForm.ts
Expand Up @@ -337,7 +337,7 @@ export function useForm<TValues extends Record<string, any> = Record<string, any
}

// No schema, each field is responsible to validate itself
const results = await Promise.all(
const validations = await Promise.all(
fields.value.map(f => {
return f.validate().then((result: ValidationResult) => {
return {
Expand All @@ -349,16 +349,23 @@ export function useForm<TValues extends Record<string, any> = Record<string, any
})
);

return {
valid: results.every(r => r.valid),
results: results.reduce((acc, r) => {
acc[r.key as keyof TValues] = {
valid: r.valid,
errors: r.errors,
};
const results: Partial<Record<keyof TValues, ValidationResult>> = {};
const errors: Partial<Record<keyof TValues, string>> = {};
for (const validation of validations) {
results[validation.key as keyof TValues] = {
valid: validation.valid,
errors: validation.errors,
};

return acc;
}, {} as Partial<Record<keyof TValues, ValidationResult>>),
if (validation.errors.length) {
errors[validation.key as keyof TValues] = validation.errors[0];
}
}

return {
valid: validations.every(r => r.valid),
results,
errors,
};
}

Expand Down Expand Up @@ -453,7 +460,7 @@ export function useForm<TValues extends Record<string, any> = Record<string, any
async function validateSchema(mode: SchemaValidationMode): Promise<FormValidationResult<TValues>> {
const schemaValue = unref(schema);
if (!schemaValue) {
return { valid: true, results: {} };
return { valid: true, results: {}, errors: {} };
}

const formResult = isYupValidator(schemaValue)
Expand All @@ -480,6 +487,9 @@ export function useForm<TValues extends Record<string, any> = Record<string, any
valid: !messages.length,
};
validation.results[path as keyof TValues] = fieldResult;
if (!fieldResult.valid) {
validation.errors[path as keyof TValues] = fieldResult.errors[0];
}

// field not rendered
if (!field) {
Expand All @@ -503,7 +513,7 @@ export function useForm<TValues extends Record<string, any> = Record<string, any

return validation;
},
{ valid: formResult.valid, results: {} } as FormValidationResult<TValues>
{ valid: formResult.valid, results: {}, errors: {} } as FormValidationResult<TValues>
);
}

Expand Down
36 changes: 22 additions & 14 deletions packages/vee-validate/src/validate.ts
Expand Up @@ -202,7 +202,7 @@ export async function validateYupSchema<TValues>(
schema: SchemaOf<TValues>,
values: TValues
): Promise<FormValidationResult<TValues>> {
const errors: ValidationError[] = await (schema as YupValidator)
const errorObjects: ValidationError[] = await (schema as YupValidator)
.validate(values, { abortEarly: false })
.then(() => [])
.catch((err: ValidationError) => {
Expand All @@ -216,16 +216,20 @@ export async function validateYupSchema<TValues>(
return err.inner || [];
});

const results = errors.reduce((acc, err) => {
const messages = err.errors;
acc[err.path as keyof TValues] = { valid: !messages.length, errors: messages };

return acc;
}, {} as Partial<Record<keyof TValues, ValidationResult>>);
const results: Partial<Record<keyof TValues, ValidationResult>> = {};
const errors: Partial<Record<keyof TValues, string>> = {};
for (const error of errorObjects) {
const messages = error.errors;
results[error.path as keyof TValues] = { valid: !messages.length, errors: messages };
if (messages.length) {
errors[error.path as keyof TValues] = messages[0];
}
}

return {
valid: !errors.length,
valid: !errorObjects.length,
results,
errors,
};
}

Expand All @@ -249,21 +253,25 @@ export async function validateObjectSchema<TValues>(
});

let isAllValid = true;
const results = (await Promise.all(validations)).reduce((acc, result) => {
acc[result.path as keyof TValues] = {
const validationResults = await Promise.all(validations);

const results: Partial<Record<keyof TValues, ValidationResult>> = {};
const errors: Partial<Record<keyof TValues, string>> = {};
for (const result of validationResults) {
results[result.path as keyof TValues] = {
valid: result.valid,
errors: result.errors,
} as ValidationResult;
};

if (!result.valid) {
isAllValid = false;
errors[result.path as keyof TValues] = result.errors[0];
}

return acc;
}, {} as Partial<Record<keyof TValues, ValidationResult>>);
}

return {
valid: isAllValid,
results,
errors,
};
}
8 changes: 8 additions & 0 deletions packages/vee-validate/tests/useForm.spec.ts
Expand Up @@ -172,6 +172,10 @@ describe('useForm()', () => {
const result = await validate();
expect(result).toEqual({
valid: false,
errors: {
field1: REQUIRED_MESSAGE,
field2: REQUIRED_MESSAGE,
},
results: {
field1: {
valid: false,
Expand Down Expand Up @@ -209,6 +213,10 @@ describe('useForm()', () => {
const result = await validate();
expect(result).toEqual({
valid: false,
errors: {
field1: REQUIRED_MESSAGE,
field2: REQUIRED_MESSAGE,
},
results: {
field1: {
valid: false,
Expand Down

0 comments on commit b439a73

Please sign in to comment.