Cannot read properties of undefined

Tu código ha intentado leer algo dentro de una caja y la caja no existe. El mensaje suele terminar con el nombre de lo que buscaba: si dice que no puede leer nombre de undefined, tu código pedía el nombre de algo que no había llegado.

Ya de paso: ¿tu app está exponiendo datos?

Analízala gratis mientras lees. Tarda treinta segundos y no toca nada.

Solo leemos lo que tu app ya le entrega a cualquier visitante.

Por qué te pasa

En una app hecha con IA la causa es casi siempre la misma: los datos aún no han llegado. Tu código pide datos a la base de datos, eso tarda, y mientras tanto la pantalla se dibuja igual. En ese primer instante la variable está vacía, el código intenta leer dentro de ella y se cae. El síntoma característico es que a veces funciona y a veces no, según lo rápida que vaya la red.

La segunda causa es que la respuesta no venía como se esperaba. Se pidió un usuario, la consulta no encontró ninguno y devolvió vacío, pero el código estaba escrito dando por hecho que siempre habría uno. O la respuesta viene envuelta en otra capa y hay que entrar un nivel más para encontrar el dato.

Y la tercera, la que enlaza con todo lo demás: el dato no llegó porque la petición falló. Si la variable de entorno no está, o la consulta la rechazaron los permisos, tu código recibe vacío y este es el error que ves. Por eso este mensaje aparece tantas veces como consecuencia de otro problema, no como problema en sí.

Lo que este error no significa

No significa que tus datos se hayan borrado. Significa que no llegaron a este trozo de código en este momento. Casi siempre están donde estaban.
No significa que haya que llenar el código de comprobaciones. Es la salida rápida y la que crea el bucle: si tapas cada sitio donde el dato falta, la pantalla deja de romperse pero se queda vacía, y ahora tienes un fallo silencioso en vez de uno ruidoso.
No es un error grave por sí mismo. Es el más común que existe en JavaScript y detrás casi siempre hay una causa sencilla, una vez que sabes qué dato es el que no llega.

Arréglalo tú, gratis

La clave está en no quedarse con el error, sino en averiguar por qué está vacío ese dato. Cinco minutos en la consola del navegador te dan la respuesta.

1Abre la app publicada, pulsa F12 y ve a la pestaña Console. Provoca el error y lee el mensaje completo: al final te dice qué propiedad intentaba leer, y ese es el nombre del dato que falta.
2En esa misma consola, pulsa sobre la línea del error para ver en qué punto del código ocurre. Aunque no sepas programar, verás el nombre de la pantalla o del componente, y eso ya acota mucho.
3Ve ahora a la pestaña Network y recarga. Busca las peticiones en rojo o con código 400, 401 o 403. Si hay alguna, ahí está la causa real: el dato no llega porque la petición se está rechazando, y lo que hay que arreglar es esa petición, no el sitio donde revienta.
4Si todas las peticiones salen en verde, ábrela y mira la respuesta. Si viene vacía o con una lista de cero elementos, el problema es que no hay datos que mostrar y el código no contempla ese caso.
5Si las peticiones van bien y traen datos, entonces sí es un problema de momento: la pantalla se dibuja antes de que lleguen. Eso se arregla en el código y va en el prompt de abajo.

Si lo que ves en Network es un 401 o un 403, no sigas por aquí: el problema es de permisos o de sesión, y las landings de esos errores te sirven más que esta.

Y esto para la parte de código

Pégaselo tal cual al agente que escribió tu app. Está redactado para que te diga lo que ha hecho, no solo para que lo haga.

Prompt para pegarle a tu agente

Mi app da el error "Cannot read properties of undefined" y necesito que encuentres la causa, no que la tapes.

El error completo es: [PEGA AQUÍ EL MENSAJE ENTERO DE LA CONSOLA].

Necesito que hagas esto:
1. Localiza la línea exacta que falla y dime qué dato esperaba encontrar ahí y de dónde debería venir.
2. Rastrea hacia atrás el origen de ese dato: qué consulta o qué llamada lo trae, y en qué casos puede llegar vacío. Enséñame esa cadena antes de cambiar nada.
3. Dime cuál de estas tres es la causa: el dato aún no ha llegado cuando se dibuja la pantalla, la consulta devuelve vacío legítimamente, o la petición está fallando. No lo supongas: si te falta información para decidirlo, dime qué necesitas.
4. Aplica el arreglo que corresponda a esa causa concreta. Si es un problema de momento, la pantalla debe mostrar un estado de carga mientras no hay datos. Si la consulta puede devolver vacío, debe mostrar un mensaje de que no hay resultados. Si la petición falla, debe mostrar un aviso de error.

No quiero que añadas comprobaciones defensivas para que el error desaparezca dejando la pantalla vacía: eso convierte un fallo visible en uno silencioso.

¿Lo has intentado y sigue sin salir?

O el escáner de arriba ha encontrado algo y prefieres no tocarlo solo. En cualquiera de los dos casos esto ya es de los gordos y merece un humano: no es que no hayas sabido, es que has llegado al punto en que hace falta alguien que entre y lo vea por dentro.

Cita a partir de mañana

Agendar revisión

99 €

Elegimos hueco, miro tu app con calma y te digo qué pasa y cómo se arregla.

Sesión de trabajo en directo contigo
Diagnóstico del error y del riesgo real
Te quedas con el arreglo aplicado

Ver huecos disponibles

Hoy, en cola prioritaria

Rescate exprés

199 €

Entras en la cola de hoy. Reservas hueco y lo dejamos resuelto en el día.

Hueco el mismo día
Prioridad sobre las revisiones agendadas
Mismo trabajo, antes

Ver huecos de hoy

Quién lo arregla

Marc Sala

IT Manager

Analista de ciberseguridad certificado por Google

No es un rating anónimo de un marketplace: es la persona que va a entrar en tu app. Reviso el código, encuentro qué falla y lo arreglo contigo delante.