Sentry-javascript: Agregar texto a elementos en breadcrumbs ui.click

Creado en 12 may. 2016  ·  18Comentarios  ·  Fuente: getsentry/sentry-javascript

Haría las cosas más fáciles, especialmente para las aplicaciones donde los nombres de las clases no revelan mucho.

Algo a lo largo de las líneas de:

 div > button.btn.btn-lg.btn-primary "Purchase"

Si el elemento contiene mucho texto, podría truncarse.

Comentario más útil

Solo quería agregar: estoy usando componentes de reacción y estilo, por lo que los nombres de mis clases se generan automáticamente, sería genial tener más contexto (sin tener que captureBreadcrumb manualmente):

screen shot 2018-07-02 at 4 36 14 pm

Todos 18 comentarios

Entonces, esto es algo que me gustaría hacer, pero me preocupa inflar nuestra función de serialización DOM hasta el punto de que comienza a agregar una sobrecarga notable para hacer clic en los controladores.

Pero, voy a explorar.

Una alternativa fácil podría ser simplemente hacer

target = elem.outerHTML;

eso generará el elemento en el que se hizo clic exactamente como está. Perderá la estructura de árbol, pero en mi experiencia personal eso no ayuda tanto como ver el elemento completo y real que estoy acostumbrado a ver en mi código todo el tiempo y, por lo tanto, puedo reconocerlo más rápidamente.

Eso también resolvería https://github.com/getsentry/raven-js/issues/576

@soroushhakami : comenzamos con outerHTML primero, pero lo descartamos para este método de utilidad.

La razón por la que no elegimos outerHTML (como comentó @mitsuhiko ):

  • el formato del selector CSS puede mostrar más información con menos caracteres
  • outerHTML puede incluir datos temporales ruidosos, por ejemplo

    • cadenas largas de data-reactid (en React 0.14 y versiones anteriores)

    • Atributos title generados dinámicamente destinados a la información sobre herramientas

  • obtendríamos muchos elementos vacíos addEventListener
  • teníamos botones con la misma clase/contenido, que solo se contextualizan a través de la información de los antepasados

Básicamente, outerHTML parece agradable cuando muestra un montón de ejemplos hipotéticos en los que se ve bien, pero nuestra experiencia de ejecutarlo en vivo durante algunas semanas fue que fue insuficiente.

Ah ya veo, tiene sentido, gracias por la explicación! 👍

He agregado etiquetas de identificación a todos mis botones. Sorprendido de que no aparezcan en las migas de pan. Incluso si fuera una etiqueta personalizada, estaría feliz con ella. Pero la etiqueta de identificación parece ser ideal debido a su singularidad.

@nblasgen : si puede proporcionar un caso de prueba fallido, me encantaría ver qué pasa.

Pero en este momento se supone que el código que verifica esto .

+1 para mostrar ID o una etiqueta personalizada como data-sentry-id="Some text here"

Cerraré este por ahora, ya que somos conscientes de esta pieza faltante y revisaremos cómo funciona esto en la próxima versión principal.

Referencia: https://github.com/getsentry/raven-js/issues/783
Referencia: https://github.com/getsentry/raven-js/issues/576

Solo quería agregar: estoy usando componentes de reacción y estilo, por lo que los nombres de mis clases se generan automáticamente, sería genial tener más contexto (sin tener que captureBreadcrumb manualmente):

screen shot 2018-07-02 at 4 36 14 pm

@kamilogorek ¿ alguna actualización sobre esto?

¿Existe la posibilidad de afinar el clic en "mensaje"?

¿Tal vez, se pueden pasar más datos a breadcrumbCallback para que las personas elijan lo que necesitan sin enviarlo a Sentry de forma predeterminada? ¿Quizás incluso un elemento dom completo?

@TuxujPes será posible en la próxima versión principal, pero no en esta, ya que requiere algunos cambios en la API pública que solo podemos introducir en las versiones principales.

@kamilogorek eso suena genial. ¿Alguna estimación sobre la fecha de lanzamiento principal?

En algún lugar cerca del final del tercer trimestre (disculpe, el tiempo de respuesta fue tan largo, estaba de vacaciones).

+1 para mostrar ID o una etiqueta personalizada como data-sentry-id="Some text here"

Podrían analizar si existe esta información y llevársela. Si existe, deja los selectores con un botón para más información.

@hiagodotme @TuxujPes @adamreisnz esta característica ya está disponible en el nuevo SDK - https://docs.sentry.io/learn/filtering/?platform=javascript#before -breadcrumb

FYI: simplemente no olvide que el uso de SDK nuevo le brinda +50 Kb para el tamaño de paquete # 1552

@ 1999 agrega 12.7kB en comparación con raven-js, no use tamaños sin gzip para comparar, ya que no es relevante.
También v5 (https://github.com/getsentry/sentry-javascript/pull/1919) será <15kB, por lo que no tendrá que preocuparse por el aumento de su carga útil.

@kamilogorek Tengo un poco de miedo a las relaciones públicas con más de 200 archivos de cambios, esto parece más un SDK completamente nuevo que una nueva versión. Además, ¿cuál es la fecha de lanzamiento de ETA?

¿Fue útil esta página
0 / 5 - 0 calificaciones