~/VibeHandbook
PDF gratis

Capítulo 12 · 03

Alimentar a la IA con el contexto correcto

Aquí es donde reside la mayor parte de tu ventaja. Cuando reportes un bug, incluye:

  • El mensaje de error, textual. Cópialo exactamente, no lo parafrasees. Parafrasear un error es como describir una foto por teléfono: te dejarás fuera el único detalle que importaba.
  • El stack trace, especialmente las primeras líneas.
  • El código relevante: la función que lanzó el error, más cualquier cosa que esta llame.
  • Lo que esperabas frente a lo que pasó.

Así es como se ve realmente un buen de depuración:

I'm getting an error when I submit the signup form. Here's the full output:

TypeError: Cannot read properties of undefined (reading 'email')
    at validateUser (src/auth/validate.js:14:23)
    at handleSignup (src/routes/signup.js:31:10)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)

Steps to reproduce: fill in the form, click "Sign up".
Expected: a "Welcome" message.
Actual: the page goes blank and the error above appears in the console.

Here is validate.js (lines around 14):
[paste the function]

And here is the handleSignup function that calls it:
[paste the function]

What could be causing this, and how do I confirm it before changing anything?

Fíjate en esa última línea. Estás pidiendo una hipótesis y un paso de confirmación, no una edición inmediata. Eso mantiene a la IA honesta.

Ayuda saber cómo leer el trace que estás pegando. Un stack trace es un historial de llamadas, del más reciente al más antiguo: la línea de arriba es donde el programa realmente explotó, y cada línea debajo es la función que llamó a la de arriba. Así que en el ejemplo, validateUser es donde se leyó email de algo indefinido, y handleSignup es quien llamó a validateUser. Los cuadros de abajo de tu propio código —como processTicksAndRejections— pertenecen al entorno de ejecución del lenguaje; normalmente puedes ignorarlos. Lee de arriba hacia abajo hasta llegar a la primera línea que apunte a tu archivo, y ahí es casi siempre donde debes empezar a buscar.

El mismo trace, leído como una pila de llamadas, hace que el orden sea obvio. El fallo está arriba; cada cuadro debajo es quien llamó al de arriba:

   READ THE TRACE         =        THE CALL STACK
   (top = newest)                  (who called whom)

 ▲ validateUser  :14  ◀── CRASH    ┌─────────────────┐ ▲ start
 │ handleSignup  :31               │ validateUser  14│ │ looking
 │ processTicks...     (runtime,   ├─────────────────┤ │ here
 │                      ignore)    │ handleSignup  31│ │
 │                                 ├─────────────────┤ │
 └─ your code first ──────────────▶│ processTicks... │─┘ (runtime)
                                   └─────────────────┘
   read DOWN until the first line that is YOUR file

¿Lo quieres sin conexión?

Descarga el libro entero en PDF o EPUB — gratis.