💎 Zod 4 is now stable!  Read the announcement.
Zod logo

Formateo de errores

Zod enfatiza la integridad y corrección en su reporte de errores. En muchos casos, es útil convertir $ZodError a un formato más útil. Zod proporciona algunas utilidades para esto.

Considera este esquema de objeto simple.

import * as z from "zod";
 
const schema = z.strictObject({
  username: z.string(),
  favoriteNumbers: z.array(z.number()),
});

Intentar analizar estos datos inválidos resulta en un error que contiene tres issues.

const result = schema.safeParse({
  username: 1234,
  favoriteNumbers: [1234, "4567"],
  extraKey: 1234,
});
 
result.error!.issues;
[
  {
    expected: 'string',
    code: 'invalid_type',
    path: [ 'username' ],
    message: 'Invalid input: expected string, received number'
  },
  {
    expected: 'number',
    code: 'invalid_type',
    path: [ 'favoriteNumbers', 1 ],
    message: 'Invalid input: expected number, received string'
  },
  {
    code: 'unrecognized_keys',
    keys: [ 'extraKey' ],
    path: [],
    message: 'Unrecognized key: "extraKey"'
  }
];

z.treeifyError()

Para convertir ("arbolizar") este error en un objeto anidado, usa z.treeifyError().

const tree = z.treeifyError(result.error);
 
// =>
{
  errors: [ 'Unrecognized key: "extraKey"' ],
  properties: {
    username: { errors: [ 'Invalid input: expected string, received number' ] },
    favoriteNumbers: {
      errors: [],
      items: [
        undefined,
        {
          errors: [ 'Invalid input: expected number, received string' ]
        }
      ]
    }
  }
}

El resultado es una estructura anidada que refleja el esquema mismo. Puedes acceder fácilmente a los errores que ocurrieron en una ruta particular. El campo errors contiene los mensajes de error en una ruta dada, y las propiedades especiales properties e items te permiten recorrer más profundamente en el árbol.

tree.properties?.username?.errors;
// => ["Invalid input: expected string, received number"]
 
tree.properties?.favoriteNumbers?.items?.[1]?.errors;
// => ["Invalid input: expected number, received string"];

Asegúrate de usar el encadenamiento opcional (?.) para evitar errores al acceder a propiedades anidadas.

z.prettifyError()

z.prettifyError() proporciona una representación de cadena legible por humanos del error.

const pretty = z.prettifyError(result.error);

Esto devuelve la siguiente cadena:

✖ Unrecognized key: "extraKey"
✖ Invalid input: expected string, received number
  → at username
✖ Invalid input: expected number, received string
  → at favoriteNumbers[1]

z.formatError()

Esto ha sido obsoleto a favor de z.treeifyError().

z.flattenError()

Mientras que z.treeifyError() es útil para recorrer una estructura anidada potencialmente compleja, la mayoría de los esquemas son planos—solo un nivel de profundidad. En este caso, usa z.flattenError() para recuperar un objeto de error limpio y superficial.

const flattened = z.flattenError(result.error);
// { errors: string[], properties: { [key: string]: string[] } }
 
{
  formErrors: [ 'Unrecognized key: "extraKey"' ],
  fieldErrors: {
    username: [ 'Invalid input: expected string, received number' ],
    favoriteNumbers: [ 'Invalid input: expected number, received string' ]
  }
}

El array formErrors contiene cualquier error de nivel superior (donde path es []). El objeto fieldErrors proporciona un array de errores para cada campo en el esquema.

flattened.fieldErrors.username; // => [ 'Invalid input: expected string, received number' ]
flattened.fieldErrors.favoriteNumbers; // => [ 'Invalid input: expected number, received string' ]

On this page