Подтвердить что ты не робот

Есть ли способ увидеть, какие функции Javascript (имя функции) выполняются в режиме реального времени в Chrome Inspector?

Например, притвориться, что есть Javascript-код, который будет выполнять someFunction() при нажатии кнопки, и я нажимаю на эту кнопку. Интересно, есть ли способ увидеть, что someFunction() только что был выполнен. Есть ли способ увидеть, какие функции выполняются в Chrome в режиме реального времени?

Если это вкладка "Профили" в инспекторе, которая делает трюк, как конкретно вы сообщаете, какие функции запускаются в режиме реального времени с этим?

EDIT 1/21/2012 12: 36p Pacific: Из комментария Брайана Никеля ниже, вкладка Timeline в Inspector - это способ увидеть, что происходит в реальном времени, но как вы видите имена выполняемых функций на временной шкале?

4b9b3361

ОТВЕТЫ

Ответ 1

Инструмент разработчика Timeline и Scripts может быть использован для достижения этой цели.

  • Откройте панель инструментов разработчика и нажмите "Запись по временной шкале", чтобы начать отслеживание активности.
  • Запустите событие, которое вас интересует (например, в вашем примере, нажмите кнопку), затем прекратите запись (или продолжите запись, но будете знать, сколько данных вы собираете).
  • Обратите внимание, что entired регистрируется на панели Timeline. Найдите соответствующее событие и нажмите стрелку twistie слева от временной шкалы для этого события. Это вызовет вызовы функций, связанные с этим событием.
  • Нажмите ссылку справа от вызовов функций, чтобы увидеть соответствующий JavaScript. (Вы запрашиваете имя функции, но имейте в виду, что событие может быть связано с анонимной функцией, поэтому не всегда доступно имя.)
  • Если вы хотите самостоятельно пройти через обработчик событий, вставьте точку останова в строке после объявления обработчика (предполагая, что объявление обработчика события больше одной строки). В качестве альтернативы, разверните точки прерывания прослушивателя событий на панели "Сценарии" и отметьте соответствующий тип события (как указано на панели "Временная шкала" для соответствующего события). Обратите внимание, что этот подход будет разбит на каждый экземпляр этого события, а не на единственный вызов, который вас интересует.

Если вы столкнулись с проблемами с мини-JavaScript и вставляете точки останова (потому что каждая строка так длинная), вот совет: откройте миниатюрный файл script на панели "Сценарии" через раскрывающийся список, затем нажмите {}. Это позволит Pretty Print, расширяя мини-код до чего-то более читаемого, добавляя пробелы. Это позволяет вам вставлять точки останова более гранулярно. Обратите внимание, что если вы вернетесь на панель временной шкалы, script ссылки (например, jquery.min.js:3) теперь используют довольно напечатанные номера строк, а не миниатюрные, безвредные.

Ответ 2

Есть много полезных утилит, которые вы можете использовать: console.trace();, debugger и т.д.