Se registraron errores del navegador en la consola

La mayoría de los navegadores se envían con herramientas para desarrolladores integradas. Por lo general, estas herramientas para desarrolladores incluyen una consola. La consola te brinda información sobre la página que se está ejecutando actualmente.

Los mensajes que se registran en la consola provienen de los desarrolladores web que crearon la página o del navegador. Todos los mensajes de la consola tienen un nivel de gravedad: Verbose, Info, Warning o Error. Un mensaje Error significa que hay un problema en tu página que debes resolver.

Cómo falla la auditoría de errores del navegador de Lighthouse

Lighthouse marca todos los errores del navegador registrados en la consola:

Auditoría de Lighthouse que muestra errores del navegador en la consola

Cómo corregir errores del navegador

Corrige cada error del navegador que informa Lighthouse a fin de asegurarte de que la página se ejecute como se espera para todos los usuarios.

Las Herramientas para desarrolladores de Chrome incluyen algunas herramientas que te ayudarán a rastrear la causa de los errores:

  • Debajo del texto de cada error, en la consola de Herramientas para desarrolladores, se muestra la pila de llamadas que provocó la ejecución del código problemático.
  • En la parte superior derecha de cada error, se incluye un vínculo que muestra el código que causó el error.

Por ejemplo, en esta captura de pantalla se muestra una página con dos errores:

Ejemplo de errores en la consola de Herramientas para desarrolladores de Chrome

En el ejemplo, el primer error proviene de un desarrollador web de una llamada a console.error(). El segundo error proviene del navegador e indica que no existe una variable utilizada en una de las secuencias de comandos de la página.

Debajo del texto de cada error, la consola de Herramientas para desarrolladores indica la pila de llamadas en la que aparece el error. Por ejemplo, para el primer error, la consola indica que una función (anonymous) llamó a la función init, que llamó a la función doStuff. Si haces clic en el vínculo pen.js:9 ubicado en la parte superior derecha de ese error, se mostrará el código relevante.

Revisar el código relevante para cada error de esta manera puede ayudarte a identificar y resolver posibles problemas.

Si no puedes determinar la causa de un error, intenta ingresar el texto del error en un motor de búsqueda. Si no puedes encontrar soluciones a tu problema, haz una pregunta en Stack Overflow.

Si no puedes corregir un error, considera unirlo en una sentencia try…catch para indicar explícitamente en el código que estás al tanto del problema. También puedes usar el bloque catch para manejar el error con mayor facilidad.

Recursos