Test some code in the CI

packages/form-core/src/FieldApi.ts

@@ -449,6 +449,7 @@ export class FieldApi<
  options?: { touch?: boolean; notify?: boolean },
  ) => {
  this.form.setFieldValue(this.name, updater as never, options)
+ console.info(`new value: "${updater}"`)
  this.validate('change')
  }
 
@@ -512,7 +513,7 @@ export class FieldApi<
  moveValue = (aIndex: number, bIndex: number) =>
  this.form.moveFieldValues(this.name, aIndex, bIndex)
 
- validateSync = (cause: ValidationCause) => {
+ validateSync = (cause: ValidationCause, errorFromField: ValidationError) => {
  const validates = getSyncValidatorArray(cause, this.options)
 
  const linkedFields = this.getLinkedFields(cause)
@@ -535,20 +536,34 @@ export class FieldApi<
  field: FieldApi<any, any, any, any>,
  validateObj: SyncValidator<any>,
  ) => {
- const error = normalizeError(
- field.runValidator({
- validate: validateObj.validate,
- value: { value: field.getValue(), fieldApi: field },
- type: 'validate',
- }),
- )
+ const error =
+ normalizeError(
+ field.runValidator({
+ validate: validateObj.validate,
+ value: { value: field.getValue(), fieldApi: field },
+ type: 'validate',
+ }),
+ ) || errorFromField
+
  const errorMapKey = getErrorMapKey(validateObj.cause)
+ console.info('field', { error, cause, errorMapKey })
+ /* console.info('field', {
+ error,
+ fieldName: field.name,
+ fieldValue: field.getValue(),
+ cause,
+ errorMapKey,
+ }) */
+
  if (field.state.meta.errorMap[errorMapKey] !== error) {
+ // console.log({ name: this.name, error, cause, meta: field.getMeta() })
  field.setMeta((prev) => ({
  ...prev,
  errorMap: {
  ...prev.errorMap,
- [getErrorMapKey(validateObj.cause)]: error,
+ [getErrorMapKey(validateObj.cause)]:
+ // Prefer the error message from the field validators if they exist
+ error ? error : errorFromField,
  },
  }))
  }
@@ -715,12 +730,24 @@ export class FieldApi<
  // If the field is pristine and validatePristine is false, do not validate
  if (!this.state.meta.isTouched) return []
 
+ let validationErrorFromForm: ValidationError
+
  try {
- this.form.validate(cause)
+ const formValidationResult = this.form.validate(cause)
+ if (formValidationResult instanceof Promise) {
+ // TODO: do something
+ } else {
+ const { fieldErrors } = formValidationResult
+ if (fieldErrors && this.name in fieldErrors) {
+ validationErrorFromForm = fieldErrors[this.name]
+ }
+ // TODO: check if field has an error
+ }
  } catch (_) {}
 
+ console.info('validate the field', cause)
  // Attempt to sync validate first
- const { hasErrored } = this.validateSync(cause)
+ const { hasErrored } = this.validateSync(cause, validationErrorFromForm)
 
  if (hasErrored && !this.options.asyncAlways) {
  return this.state.meta.errors

packages/form-core/src/FormApi.ts

@@ -397,6 +397,12 @@ export class FormApi<
  const validates = getSyncValidatorArray(cause, this.options)
  let hasErrored = false as boolean
 
+ let fieldErrors:
+ | Partial<Partial<Record<DeepKeys<TFormData>, ValidationError>>>
+ | undefined
+
+ const obj: Partial<Record<ValidationErrorMapKeys, typeof fieldErrors>> = {}
+
  this.store.batch(() => {
  for (const validateObj of validates) {
  if (!validateObj.validate) continue
@@ -410,8 +416,19 @@ export class FormApi<
  type: 'validate',
  })
 
- const { formError, fieldErrors } = normalizeError(rawError)
+ const { formError, fieldErrors: fieldErrorsFromNormalizeError } =
+ normalizeError<TFormData>(rawError)
+ // TODO: Check if it's ok when we have multiple validators
+ if (fieldErrorsFromNormalizeError) {
+ fieldErrors = fieldErrors
+ ? { ...fieldErrors, ...fieldErrorsFromNormalizeError }
+ : fieldErrorsFromNormalizeError
+ }
  const errorMapKey = getErrorMapKey(validateObj.cause)
+ if (fieldErrorsFromNormalizeError) {
+ obj[errorMapKey] = fieldErrorsFromNormalizeError
+ }
+ console.info('form', { errorMapKey, cause, fieldErrors })
 
  if (fieldErrors) {
  for (const [field, fieldError] of Object.entries(fieldErrors)) {
@@ -462,7 +479,9 @@ export class FormApi<
  }))
  }
 
- return { hasErrored }
+ console.log({obj})
+
+ return { hasErrored, fieldErrors }
  }
 
  validateAsync = async (
@@ -479,6 +498,9 @@ export class FormApi<
  * when there are no validators needed to be run
  */
  const promises: Promise<ValidationError | undefined>[] = []
+ let fieldErrors:
+ | Partial<Partial<Record<DeepKeys<TFormData>, ValidationError>>>
+ | undefined
 
  for (const validateObj of validates) {
  if (!validateObj.validate) continue
@@ -519,7 +541,14 @@ export class FormApi<
  } catch (e: unknown) {
  rawError = e as ValidationError
  }
- const { formError, fieldErrors } = normalizeError(rawError)
+ const { formError, fieldErrors: fieldErrorsFromNormalizeError } =
+ normalizeError<TFormData>(rawError)
+
+ if (fieldErrorsFromNormalizeError) {
+ fieldErrors = fieldErrors
+ ? { ...fieldErrors, ...fieldErrorsFromNormalizeError }
+ : fieldErrorsFromNormalizeError
+ }
  const errorMapKey = getErrorMapKey(validateObj.cause)
 
  if (fieldErrors) {
@@ -564,14 +593,26 @@ export class FormApi<
 
  validate = (
  cause: ValidationCause,
- ):
- | InternalFormValidationError<TFormData>[]
+ ): /* | InternalFormValidationError<TFormData>[]
+ | Promise<InternalFormValidationError<TFormData>[]> => { */
+
+ | {
+ fieldErrors?:
+ | Partial<Partial<Record<DeepKeys<TFormData>, ValidationError>>>
+ | undefined
+ }
+ /* | Promise<{
+ fieldErrors?:
+ | Partial<Partial<Record<DeepKeys<TFormData>, ValidationError>>>
+ | undefined
+ }> => { */
  | Promise<InternalFormValidationError<TFormData>[]> => {
  // Attempt to sync validate first
- const { hasErrored } = this.validateSync(cause)
+ const { hasErrored, fieldErrors } = this.validateSync(cause)
+ console.info({ hasErrored, fieldErrors })
 
- if (hasErrored && !this.options.asyncAlways) {
- return this.state.errors
+ if (hasErrored || !this.options.asyncAlways) {
+ return { fieldErrors }
  }
 
  // No error? Attempt async validation