Контрольные точки отладки Chrome javascript ничего не делают?

Похоже, я не могу понять инструмент отладки Chrome.

У меня хромированная версия 21.0.1180.60 м.

Шаги, которые я сделал:

Я нажал ctrl-shift-i, чтобы открыть консоль.
Нажав на "Источники", выберите соответствующий файл javascript, который я хочу отлаживать.
Я установил точки останова, где я хочу, чтобы код остановился, поместив синий тег на желоб рядом с строкой слева.
Я нажал кнопку на моей веб-странице (которая представляет собой страницу с предоставлением php), которая инициирует код javascript.
Код успешно завершился без остановки.

Я также заметил, что Watch Expressions тоже не работают. Он продолжает говорить мне, что переменная, которую я хочу посмотреть, это undefined.

Дальнейшее тестирование показало, что это мой код, вызывающий потерю точки останова. Кажется, что он не работает на "$ (" # frmVerification "). Submit (function() {" line. Он не входит в контрольные точки внутри этой функции().

Ниже:

//function to check name and comment field 
var test = "this is a test";
var test2 = "this is another test";

function validateLogin(){
    //if(userEmail.attr("value") && userPass.attr("value"))
        return true;
    //else
        //return false;
}

//onclick on different buttons, do different things.
function ajaxRequest(){

}
$(document).ready(function(){
  //When form submitted
    $("#frmVerification").submit(function(){
        var username = $("#username");
        var token = $("#token");
        var action = $("#action");
        var requester = $("#requester");
        if(validateLogin()){
            $.ajax({
            type: "post",
            url: "verification.php",
            data: "username="+username.html()+"&token="+token.val()+"&action="+action.val()+"&requester="+requester.val(),
            success: function(data) {
                try{
                    var jsonObj = $.parseJSON(data); //convert data into json object, throws exception if data is not json compatible
                    if(jsonObj.length > 0){//if there is any error output all data
                        var htmUl = $('<ul></ul>');
                        $.each(jsonObj, function(){
                            htmUl.append('<li>' + this + '</li>');
                        });
                        $("#errOut").html(htmUl);
                    }else{
                        alert("Your account is now activated, thank you. If you have already logged in, press OK to go to the home page. If not, you must log in first.");
                        window.location.replace("home.php");
                    }
                }
                catch(e){//if error output error to errOut]
                    $("#errOut").html("PHP module returned non JSON object: <p>"+data+"</p>");
                }
            }
        });
    }
    else alert("Please fill UserName & Password!");
        return false;
    });
});

Ответы

Ответ 1

Я не уверен, почему ваши точки останова не попадают, но один надежный способ войти в ваш код - напечатать

debugger;

где вы хотите, чтобы код был остановлен, а затем снова запустить с открытием окна инструментов Chrome.

Только одна маленькая вещь, о которой нужно знать, обязательно очистите ее после завершения и удалите строки отладчика. Если вы запускаете файлы JavaScript через компрессор YUI, существование строки debugger; приведет к ошибке.

Ответ 2

Это поздний ответ, но у меня была та же проблема, но ответ был другим.

В моем случае в моем коде была ссылка на sourceURL:

//@ sourceURL=/Scripts/test.js

Когда этот файл Javascript минимизируется и загружается браузером, он обычно сообщает Chrome Dev Tools, где находится незавершенная версия.

Однако, если вы отлаживаете незавершенную версию, и эта строка существует, Chrome Dev Tools отображает этот путь sourceURL вместо "обычного" пути.

Например, если вы работаете локально на веб-сервере, то на вкладке "Источники" в Chrome Dev Tools путь к указанному файлу JS будет http://localhost/Scripts/test.js

Если test.js имеет это внизу

//@ sourceURL=/Scripts/test.js

тогда точки останова будут работать, только если путь к файлу /Scripts/test.js, а не полный URL-адрес http://localhost/Scripts/test.js

В Chrome 38, следуя моему примеру выше, если вы посмотрите на вкладку Sources, каждый файл запускается с http://localhost/, поэтому при нажатии на test.js Chrome загружает http://localhost/Scripts/test.js

Вы можете поместить все нужные вам точки останова в этот файл, и Chrome никогда не достигнет ни одной из них. Если вы поместите точку останова в свой JS до того, как он вызовет какую-либо функцию в test.js, а затем войдете в эту функцию, вы увидите, что Chrome открывает новую вкладку, путь которой /Scripts/test.js. Размещение точек останова в этом файле остановит выполнение программы.

Когда я избавился от строки @sourceURL из файла JS, все снова работает нормально (то есть так, как вы ожидаете).

Ответ 3

Вероятно, эта ошибка https://code.google.com/p/chromium/issues/detail?id=278361

Это воспроизводится с моим Chrome 31.0.1650.57 (Official Build 235101) в Linux.

Я запускаю браузер, чтобы исправить его.

Ответ 4

У меня возникла аналогичная проблема. Точки останова, где не работает, если я не использовал debugger;. Я исправил проблему с точки останова с помощью "Восстановить значения по умолчанию и перезагрузить". Он находится в инструментах разработчика Chrome, настройках, восстанавливает значения по умолчанию и перезагружается.

Ответ 5

Убедитесь, что script с "отладчиком"; выражение в нем не черное с Chrome. Вы можете перейти на вкладку "Источники", чтобы проверить и отключить черный ящик, если это так.

EDIT: Добавлен снимок экрана.

Ответ 6

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

Ответ 7

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

Сценарий:

У меня есть одна страница, которая использует два мода загрузочных модуля, которые поступают из одного источника и одного набора файлов javascript (blueimp awesome jquery fileupload).

BS Modal 1 отображается на загрузке страницы (через php) и всегда присутствует на странице. Он используется для добавления новой связанной записи. (CakePHP.... думаю, что тип SalesForcey типа)
BS Modal 2 используется для редактирования существующих связанных записей, и содержимое html извлекается из вызова ajax и добавляется в DOM через jQuery.
Javascript, поддерживающий оба модальных файла, включая стандартные теги html <script>.

Я заметил, что точки останова запускаются только на Modal 1. Они не работают, когда код выполняется на динамически добавленном Modal 2, хотя совершенно очевидно, что код действительно оценивается и запускается. Появляются флажки предупреждений, вещи типа codey выполняются и выводятся по логике, изложенной в коде.

Я не погружался глубже, чтобы исследовать дальше, потому что я настаивал на времени, но хотел поместить его туда и вернуть сообщество.

PS: Я использую SO все время, но это мой первый пост, так что легко на меня: -)

Ответ 8

Убедитесь, что вы используете один и тот же хост в URL-адресе, который был у вас при настройке сопоставления. Например. если вы были в http://127.0.0.1/my-app при настройке и отображении рабочей области, то точки останова не будут работать, если вы просмотрите страницу с помощью http://localhost/my-app. Кроме того, спасибо за то, что вы читаете это. См. Мой ответ на проблему Chromium здесь.

Ответ 9

убедитесь, что вы открыли консоль javascript (или источники) в вашем хромированном окне. иначе он никогда не попадет в точку останова. вы можете открыть консоль javascript с помощью кнопки выбора в правом верхнем углу → tools → javascript console.

Ответ 10

У меня была проблема, когда точки останова Chrome ничего не стреляли. Когда я пытался использовать "отладчик" в своем коде, я мог только выполнить код в версии VM моего кода. Моя проблема заключалась в том, что я неправильно отображал ресурсы. Re-mapping исправил мою проблему.

Ответ 11

Моим решением было очистить локальное хранилище, хранилище сеансов и файлы cookie на вкладке "Приложения". После этого Chrome приостановит выполнение скрипта в точках останова, определенных в Sources.

Нажмите на вкладку Приложения Google Chrome.
Щелкните правой кнопкой мыши URL-адрес в каждой папке> Очистить

Снимок экрана: вкладка "Приложения"

Ответ 12

Итак, в дополнение к ответу Адама Ракиса, если у вас есть ошибки в вашем файле javascript выше точки останова, вы не достигнете его, независимо от того, флаг вы его отметили или введите debugger;.

Вот пример:

if (nonExistentVar === "something") {
  console.log("this won't happen as the above errors out");
}
debugger;
console.log("this won't print either")

Ответ 13

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

поместите это где-нибудь в файл javascript, который вы хотите запустить

debugger

откройте консоль браузера и перезагрузите страницу.

отладчик будет работать как пример изображения ниже

Ответ 14

Я не уверен, как это работает, но нажатие клавиши F1 для настроек и справа внизу, нажатие кнопки "Восстановить значения по умолчанию и перезагрузить" сработало для меня.

Ответ 15

Довольно поздний ответ, но ничего из вышеперечисленного не помогло моему делу и было чем-то другим

во время ссылки на файл javascript type = "text/javascript" отсутствовал в унаследованном приложении, над которым я работал

<script  src="ab.js" ></script>

ниже одного сработало, и точки останова достигли ожидаемого уровня

 <script  src="ab.js" type="text/javascript"></script>

Ответ 16

У меня была такая же проблема в файле строки 10K. Точки останова игнорировались,
жестко закодированные инструкции _debugger, но они не могут быть переключены и могут быть раздражающими при размещении в цикле. Мое решение, которое немного взломано, но оно работает, заключается в том, чтобы добавить в верхнюю часть файла следующее:

let myDebuggerFlag = false;
let myDebugger = function () {
    if (myDebuggerFlag) {
        debugger;
    }
}

то я добавляю myDebugger(); inline, где я обычно использовал бы точку останова.

чтобы включить отладку, просто введите myDebuggerFlag = true; на консольной линии. (сначала вы должны выйти из myDebugger.