Отладка javascript в google chrome – blackbox

Отладка javascript в google chrome – blackbox

Отладка javascript в google chrome – blackbox

Как и все, вы получаете ошибки в своем коде приложения. Вы начинаете отладку своего кода во вкладке source, но когда вы построчно проходите свой код в поисках ошибки, отладчик иногда перескакивает в исходный файл, который не является частью вашего app (например, сторонняя JS-библиотека). Я уверен, что в моменты «прыжка» в сторонние библиотеки вы чувствуете боль, и она вас не отпускает, пока, наконец, не вернетесь к коду своего приложения.
Специальная настройка «Blackboxing» в Devtools Google Chrome дает вам возможность завести черный список для сторонних библиотек, чтобы отладчик мог маршрутизировать свой путь и игнорировать их. Когда вы положите файл сторонней библиотеки в черный список blackbox, отладчик не будет перескакивать в этот файл при выполнении кода, который вы отлаживаете

Снимок экрана выше показывает, что app.js открыт, где была установлена точка breakpoint. При входе в этот код, backbone.js открывается, а затем underscore.js. Это может быть трудоемким процессом и нежелательным.
Что происходит, когда файл скрипта в черном списке?

• Если включена функция «Пауза для исключений», то сброшенные из кода библиотеки, не будут приостановлены

• Включение / выключение / перекрытие кода библиотеки, • Контрольные точки прослушивателей событий не прерываются в библиотечном коде,

• Отладчик не будет останавливаться на всевозможных контрольных точках, установленных в библиотечном коде. В конечном итоге вы будете дебажить только свой код, а не код сторонних разработчиков.

Как использовать сценарии Blackbox

Есть два способа добавить скрипты в черный список черного ящика:

  • Используя панель «Настройки»
  • Щелкните правой кнопкой мыши на любом скрипте на панели «Источники»

Панель настроек

С помощью панели «Настройки» настройте черные листы Blackbox. Откройте «Настройки DevTools» и в разделе «Источники» нажмите «Управление черным ящиком».

Это откроет диалог, в котором вы можете ввести имена файлов сценариев, которые вы хотите добавить в черный список.
Вы можете сделать это несколькими способами:

• введите имя файла,

• использовать регулярные выражения для таргетинга: o файлы, которые содержат определенное имя /backbone.js$, o определенные типы файлов, такие как \ .min \ .js $

• или введите всю папку, содержащую сценарии, которые вы хотите использовать в Blackbox, такие как bower_components.

Возможно, вам захочется временно отключить брандмауэр для проверки. Вы можете сделать это, изменив поведение на «Отключено». Если вы хотите полностью удалить правило, вы можете щелкнуть X, чтобы удалить его.

Контекстные меню

Чтобы использовать панель «Настройки» для добавления файлов в черный список, вы можете использовать контекстное меню при работе на панели «Источники». При просмотре файла вы можете щелкнуть правой кнопкой мыши в редакторе. И вы можете щелкнуть правой кнопкой мыши файл в навигаторе файлов. Оттуда выберите Blackbox Script. Это добавит файл в список на панели «Настройки».

Когда вы просматриваете черновик в редакторе на панели «Источники», вы увидите желтую сноску, указывающую, что скрипт находиться в черном листе. Нажатие на кнопку “подробнее” расширяет панель для дополнительную информацию.

Когда вы остановились на контрольной точке, в стеке вызовов вы увидите сообщение с указанием количества скриптов, которые находятся в черном списке. Вы можете нажать на кнопку Show и увидеть все скрытые скрипты.
Скрипты Blackboxing могут помочь повысить производительность и помочь сосредоточиться на коде, который вам интересен. Легко включить использование любого рабочего процесса и так же легко отключить, если возникнет необходимость в этом.

> Автор оригинала: официальная документация от Google Chrome Developers
>  Оригинал статьи на английском
Отставить отзыв

Ваш e-mail не будет опубликован. Обязательные поля помечены *