Как отлаживать динамически загружаемый JavaScript (с помощью jQuery) в самом отладчике браузера? - PullRequest
Новая
       37

Как отлаживать динамически загружаемый JavaScript (с помощью jQuery) в самом отладчике браузера?

76 голосов
/ 01 февраля 2012

Динамически добавленный сценарий не отображается в разделе сценариев отладчика браузера.

Объяснение:

Мне нужно использовать, и я использовал 

if( someCondition == true ){
   $.getScript("myScirpt.js", function() {
       alert('Load Complete');
       myFunction();
   });
}

, поэтомучто myScript.js может быть динамически загружен при выполнении некоторого условия ... И myFunction может быть вызван только после загрузки всего скрипта ...

Но браузеры не показывают динамически загруженный myScript.js в их отладчикераздел сценария.

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

Ответы [ 5 ]

184 голосов
/ 03 января 2013

Вы можете дать вашему динамически загруженному сценарию имя, которое будет отображаться в отладчике Chrome / Firefox JavaScript. Для этого вы помещаете комментарий в конец скрипта: 

//# sourceURL=filename.js

Этот файл будет отображаться на вкладке «Источники» как filename.js. По моему опыту вы можете использовать \ 'ы в имени, но я получаю странное поведение при использовании /'s.

Для получения дополнительной информации см .: Точки останова в динамическом JavaScript устаревание // @ sourceurl

12 голосов
/ 24 сентября 2016

Вы можете использовать //# sourceURL= и //# sourceMappingURL= в конце файла сценария или тега сценария.

ПРИМЕЧАНИЕ: //@ sourceURL и //@ sourceMappingURL устарели.

10 голосов
/ 21 мая 2014

Я попытался использовать «// # sourceURL = filename.js», который был предложен в качестве обходного пути OP, но он все еще не появлялся на панели «Источники», если он уже не существовал в моих вкладках изпредыдущий раз, когда он выдал исключение.

Кодирование «отладчика»;линия заставила его прорваться в этом месте.Затем, попав в мои вкладки на панели «Источники», я мог установить точки останова, как обычно, и удалить «отладчик»;линия.

4 голосов
/ 01 июля 2016

Обратите внимание, что исходный файл, отображаемый на вкладке источников, будет отображаться в группе (без домена) , и, если вы хотите его отладить, вам нужно будет добавить строку debugger; в вашем коде заставьте эту строку быть выполненной (обычно в начале выполнения вашего исходного файла), а затем добавьте свои точки останова куда угодно.

Если вы отлаживаете производственные этапы, на которых в вашем коде, вероятно, не будет строк debugger;, это можно сделать, выполнив локальную карту с помощью CharlesProxy для вашей "свежей копии исходного файла со строкой отладчика". вставлено».

0 голосов
/ 10 июля 2019

Пытаясь отследить подобные вещи в IE, я открываю инструменты разработчика (F12) и затем нахожу, где разместить точку останова, используя следующую строку в консоли: 

debugger;myFunction();

Это переключается на вкладку отладчика, где вы можете перейти к myFunction() и установить точку останова.

...