5

Esta es una pregunta bastante complicada que puede ser simplemente imposible con lo que está disponible actualmente, pero si hubiera una manera fácil de hacerlo, sería enorme.Puntos de interrupción ininterrumpidas (puntos de rastreo) en Javascript?

Estoy depurando algo de JavaScript en Chrome, y como está muy orientado a los eventos, prefiero obtener informes de seguimiento del código (qué se llamó, etc.) en lugar de puntos de interrupción. Entonces, donde sea que deje un punto de interrupción, me gustaría ver el nombre de la función local y los argumentos.

El más cercano que puedo conseguir es dejar caer un punto de interrupción condicional en, como los siguientes:

Sample trace

Hay dos grandes problemas con este enfoque:

  1. pegar esto en cada punto de interrupción es demasiado engorroso Sería mucho más probable que las personas lo usen si se pudiera elegir como la acción predeterminada para cada punto de interrupción.
  2. En Google Chrome, las llamadas de registro se activan dos veces.

¿Alguna idea sobre una manera de superar cualquiera de estos problemas? Creo que podría ser posible en IE with VS, pero la interfaz de usuario parece igualmente engorrosa.

+1

Si solo necesita esto para rastrear eventos DOM, puede intentar usar el método ['monitorEvents()'] (http://www.briangrinstead.com/blog/chrome-developer-tools-monitorevents) de la consola. – kpozin

+0

De hecho, intenté usar monitorEvents en un punto, lanzando pseudo-eventos para objetos que no son DOM. Puede llegar bastante lejos al monitorear los errores, pero no tiene el filtrado preciso que necesitaba. – Chris

Respuesta

0

No he podido encontrar algo para hacer esto, por lo que wrote my own.

Ahora, en lugar de insertar y eliminar constantemente llamadas a console.log, dejo el registro y solo lo veo cuando sea necesario.

Advertencia: el código específico siguiente no se ha probado.

var debug = TraceJS.GetLogger("debug", "mousemove"); 
$('div').mousemove(function(evt) { 
    debug(this.id, evt); 
}); 

Cada vez que el ratón se mueve sobre un DIV, se genera un logevent etiquetada [ "mousemove", {id de ese elemento}]

La parte divertida es ser capaz de ver selectivamente eventos. Cuando sólo desea ver los eventos mousemove para el elemento #A, llame a la siguiente en la consola:

TraceJS('a'); 

Cuando quiero ver todos los eventos mousemove, puede llamar:

TraceJS('mousemove'); 

Sólo los eventos que coincide con su filtro se muestran. Si llama a TraceJS (sin argumento), las llamadas de registro dejan de mostrarse.

1

La mejor opción que encontré fue editar el código javascript en el panel Javascript de Chrome, agregando un archivo console.log.

Solo funcionaría después de que la página se haya cargado (a menos que pueda permitirse poner un punto de interrupción después de la actualización y luego agregue las líneas de registro) y (para empeorar) tendría que hacerlo cada vez que recarga el página.

¡Buena suerte con su búsqueda!

1

IE11 ahora tiene "puntos de seguimiento", independientemente de Visual Studio. Hacen exactamente lo que pediste hace tres años. Todavía no los veo en Chrome ni en ningún otro navegador, ¡pero espero que se verán pronto!

+0

¡Genial! https://msdn.microsoft.com/en-us/library/ie/dn255007(v=vs.85).aspx De hecho, me gusta la biblioteca que configuré ahora, ya que puedo dejar puntos de rastreo todo el tiempo y convertirlos encendido y apagado según sea necesario. Supongo que eso es lo que sucede. – Chris

Cuestiones relacionadas