Как включить средства отслеживания событий для определенного файла JavaScript в Chrome Developer Tools?

Question

Мне нужно знать, какая функция JavaScript вызывается внутри файла, когда я нажимаю кнопку. Моя проблема в том, что у меня очень большой файл JavaScript, и у меня нет документации по нему. Мне было интересно, можно ли каким-либо образом включить средства наблюдения за событиями только для этого конкретного файла в инструментах разработчика Chrome, чтобы при нажатии на кнопку мне сообщалось, какая функция вызывается в этом гигантском файле.

До сих пор я мог использовать вкладку Global Listeners для отслеживания событий щелчка мышью, но это приведет меня к jquery-(version).js, и это ни к чему не приведет.

Я думаю, это было бы похоже на установку точек останова на каждую строку этого файла, но я не могу этого сделать из-за размера файла.

Answer 1

Исходя из характера вашего вопроса, я предполагаю, что рассматриваемый гигантский файл Javascript минимизирован или запутан иным образом, что затрудняет семантический поиск (т. Е. Ctrl + F ищет ключевые слова, такие как "onClick" в файле).

Я не уверен, что есть какой-то особенно чистый способ сделать это. Я думаю, что вам лучше всего использовать точки прослушивания событий отладчика Chrome, чтобы пройти через все прослушиватели щелчков, пока не найдете тот, который вызывает ваш файл.

• Откройте вкладку « Точка останова приемника событий » в отладчике Chrome, откройте раздел « Мышь » и нажмите « Проверить». Это прикрепляет точки останова ко всем слушателям событий js click в вашем DOM (поэтому может быть полезно сделать это в окне инкогнито или отключить любые расширения, которые имеют прослушиватели щелчков).
• Когда точки останова срабатывают, нажимайте кнопку "возобновить", пока точка останова не сработает внутри исследуемого файла.
• Если ваш файл никогда не появляется, то, вероятно, у вас впереди немного утомительной работы. Сделайте еще один щелчок, только сейчас, начните входить в обратные вызовы и посмотрите, не приведет ли какой-либо из них в итоге к вашему файлу.
  • Не заходите слишком глубоко в данный обратный вызов, если он не выглядит многообещающим. Вы можете вернуться к нему, если это будет необходимо. Сделайте несколько относительно мелких проходов (то есть сделайте только несколько функций глубоко в каждом обратном вызове), чтобы исключить маловероятные выводы.
  • Оставьте любые обратные вызовы библиотек (JQuery, Kefir и т.д.) Как последнее, что нужно исследовать, поскольку они часто являются самыми глубокими и часто просто внутренней логикой в работе.
• Если вы по-прежнему не находите ничего после перехода к обратным вызовам click , вы можете попытаться установить точки останова на mousedown или mouseup.