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.
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 ):
outerHTML
puede incluir datos temporales ruidosos, por ejemplodata-reactid
(en React 0.14 y versiones anteriores)title
generados dinámicamente destinados a la información sobre herramientasaddEventListener
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):
@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?
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):