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

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

Пояснение:

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

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

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

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

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

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

//# sourceURL=filename.js

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

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

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

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

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

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

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

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

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

debugger;myFunction();

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