Captura automáticamente los errores de JavaScript en tu sitio web con contexto detallado para una depuración más rápida.
Habilitar el seguimiento de errores
El seguimiento de errores captura automáticamente errores de JavaScript no detectados y rechazos de promesa no manejados una vez que se activa para un sitio web. Es parte del mismo script de seguimiento que ya instalaste:
<script
defer
data-tracking-code="YOUR_TRACKING_CODE"
src="https://api.zenovay.com/z.js"
></script>
Activación
El seguimiento de errores se controla mediante una bandera de características en cada sitio web:
- Abre el panel de tu sitio web y ve a Configuración → Avanzado
- Bajo Banderas de características, activa Seguimiento de errores
Eso es todo. No hay cambios de script que hacer, la bandera se entrega al rastreador automáticamente. Los nuevos errores comienzan a aparecer en la pestaña Errores.
Información
El seguimiento de errores es una función Pro. Si el botón muestra una insignia de plan requerido, necesitarás estar en Pro, Scale o Enterprise para habilitarlo.
Qué se captura
Información de errores
Para cada error, Zenovay captura:
| Datos | Descripción |
|---|---|
| Mensaje de error | La descripción del error |
| Tipo de error | TypeError, ReferenceError, etc. |
| Traza de pila | Pila de llamadas completa |
| Archivo de origen | Archivo donde ocurrió el error |
| Línea y columna | Posición exacta |
| URL | Página donde ocurrió el error |
| Agente de usuario | Navegador y sistema operativo |
| ID de visitante | Enlace a la sesión |
| Marca de tiempo | Cuándo ocurrió el error |
Datos contextuales
Contexto adicional capturado con cada error:
- URL de la página y referente
- Información del navegador y el dispositivo
- Breadcrumbs: navegación reciente, clics, salida de consola y solicitudes de red que conducen al error
- La versión y el entorno bajo el cual se reportó el error (si tu código los establece)
Ver errores
Panel de errores
Abre el panel de tu sitio web y selecciona la pestaña Errores (bajo Confiabilidad en la barra lateral):
- Ve tendencias de conteo de errores a lo largo del tiempo
- Visualiza los principales grupos de errores por ocurrencia
- Filtra por estado
- Haz clic en cualquier grupo de errores para obtener detalles
Lista de errores
La lista de errores muestra:
| Columna | Descripción |
|---|---|
| Error | Mensaje de error (truncado) |
| Recuento | Número de ocurrencias |
| Primero visto | Cuándo ocurrió primero |
| Último visto | Ocurrencia más reciente |
| Estado | No resuelto, Investigando, Resuelto o Ignorado |
Vista de detalle de error
Haz clic en un grupo de errores para ver:
- Mensaje de error completo
- Traza de pila
- Navegadores, sistemas operativos y dispositivos afectados
- Páginas donde ocurre el error
- Cronología de ocurrencias
- Breadcrumbs que conducen al error
También puedes cambiar el estado de un grupo (marcarlo como Investigando, Resuelto o Ignorado) para mantener tu lista enfocada en lo que aún necesita atención.
Tipos de errores
Tipos de errores comunes
| Tipo | Descripción | Causas comunes |
|---|---|---|
TypeError | Error relacionado con el tipo | Acceso a propiedades indefinidas |
ReferenceError | Referencia a indefinido | Variables indefinidas |
SyntaxError | Sintaxis inválida | JSON mal formado, errores tipográficos |
RangeError | Valor fuera de rango | Longitud de matriz inválida |
URIError | Error de manejo de URI | URIs mal formados |
EvalError | Error eval() | Obsoleto, raramente visto |
Los errores también se clasifican por categoría (JavaScript, red, recurso o personalizado) y gravedad, que el panel usa para ayudarte a priorizar.
Rechazos de promesa
// Rechazo no manejado - capturado automáticamente
Promise.reject(new Error('Something failed'));
// Rechazo manejado - no capturado
Promise.reject(new Error('Something failed'))
.catch(error => handleError(error));
Mapas de origen
El código minificado produce trazas de pila ilegibles:
Error: undefined is not a function
at a.b (main.min.js:1:2345)
at c.d (main.min.js:1:3456)
Con mapas de origen cargados, el panel puede mostrar tu código original:
Error: undefined is not a function
at processPayment (checkout.js:45:12)
at handleSubmit (form.js:123:8)
Los mapas de origen se cargan a través de la API de seguimiento de errores y se asignan a errores mediante un identificador release. Integra la carga en tu pipeline de compilación para que cada versión se entregue con sus mapas.
Para la referencia completa de carga (punto de conexión, campos y ejemplo de CI), ver Mapas de origen para errores JS.
Filtrar errores
Los errores que se originan en la infraestructura de seguimiento propia de Zenovay se eliminan automáticamente, por lo que solo ves errores de tu propio código.
Para reducir el ruido restante, enfócate en lo que es accionable en el panel:
- Usa el estado Ignorado para silenciar un error conocido de terceros o extensión de navegador para que deje de abarrotar tu lista.
- Resuelve los grupos que has solucionado para que las nuevas ocurrencias destaquen.
Alertas de errores
Recibe notificaciones cuando los errores aumenten usando una regla de automatización:
- Abre el panel de tu sitio web y ve a Configuración → Automatización
- Crea una regla con el disparador Umbral de tasa de error
- Establece el umbral (errores por hora)
- Elige cómo deseas ser notificado: correo electrónico, webhook o Slack
Cuando la tasa de error cruza tu umbral, Zenovay activa la acción que configuraste.
Integración con repetición de sesión
Si la repetición de sesión está habilitada para el sitio web, los errores pueden vincularse a grabaciones para que puedas ver qué estaba haciendo el usuario cuando ocurrió un error. La repetición de sesión tiene un modo de disparador Solo errores (bajo Configuración → Avanzado → Banderas de características) que registra sesiones específicamente alrededor de errores, lo que mantiene el almacenamiento enfocado en las sesiones que vale la pena ver.
Esto te ayuda a entender:
- Qué estaba haciendo el usuario
- Estado de la interfaz de usuario cuando ocurrió el error
- Pasos para reproducir
Mejores prácticas
Manejo deliberado de errores
Captura y maneja los errores de los que puedas recuperarte, y deja que los que no puedas se dirijan al rastreador:
// Bien: manejo específico y recuperable
try {
const data = JSON.parse(userInput);
} catch (error) {
if (error instanceof SyntaxError) {
showValidationError('Invalid JSON format');
} else {
throw error; // irrecuperable - dejar ser capturado
}
}
Reducción de ruido
- Marcar errores de extensión de navegador y de terceros conocidos como Ignorados
- Resolver grupos a medida que entregan correcciones
- Priorizar por gravedad y recuento de ocurrencias
Solución de problemas
Los errores no aparecen
Verifica:
- El script se carga antes de que ocurran errores
- El seguimiento de errores está habilitado bajo Configuración → Avanzado → Banderas de características
- Un bloqueador de anuncios no bloquea solicitudes a
api.zenovay.com
Trazas de pila faltantes
Verifica:
- Los mapas de origen se cargan para código minificado (ver Mapas de origen para errores JS)
- Los encabezados CORS se establecen para scripts de origen cruzado
- El error no proviene de un script de terceros
Demasiados errores
Considera:
- Marcar grupos ruidosos conocidos como Ignorados
- Revisar y corregir primero errores de alto volumen