Эй-эй, Кейси снова здесь, чтобы получить еще один дайджест, чтобы рассказать вам о том, что нового в DevTools с прошлого месяца.
Новые возможности в консоли
В Chrome 56, который в настоящее время находится в Canary, консоль DevTools работает на базе CodeMirror . Это открывает целый ряд новых функций, таких как:
Подсветка синтаксиса при вводе . Раньше DevTools мог выделять синтаксис только после оценки блока кода.
Соответствующая скобка/скобка/подсветка фигурной скобки . Если у вас есть лишняя скобка, скобка или фигурная скобка, DevTools выделяет ее красным.

Соответствующие скобки, скобки или фигурные скобки выделяются серым цветом, когда курсор находится рядом с одной из них.

Умный возврат . Когда вы вводите многострочный блок кода, DevTools теперь знает, создавать ли новую строку или выполнять код каждый раз, когда вы нажимаете Enter . Например, предположим, что вы хотите выполнить следующий цикл for
в консоли:
for (var i = 0; i < 5; i++) {
console.log(i);
}
Раньше нажатие Enter после ввода первой строки приводило к тому, что DevTools оценивал эту строку, что приводило к ошибке. Чтобы продолжить блок кода на новую строку, вам пришлось бы удерживать Shift перед нажатием Enter . Напротив, теперь DevTools просто автоматически продолжает блок кода на новой строке после того, как вы нажмете Enter , как и ожидалось.
Несколько курсоров . Удерживайте Command (Mac) или Control + Alt (Windows, Linux), а затем щелкните.

Canary теперь выделяет нетоповые контексты красным цветом.
Если вы недавно работали в консоли, возможно, вы столкнулись с небольшой неприятной ошибкой, которая устанавливала для селектора контекста выполнения значения, отличные от top
.
Эта ошибка должна быть исправлена в стабильной версии, но на всякий случай DevTools в Canary (Chrome 56) теперь предупреждает вас, что вы не находитесь в top
контексте, выделяя селектор красным.

Новый пользовательский агент: UC Browser.
Теперь вы можете выбрать UC Browser для iOS, Android или Windows Phone на вкладке «Условия сети» .

Делиться значит заботиться
Как всегда, мы будем рады услышать ваши отзывы или идеи по поводу всего, что связано с DevTools.
- Пишите нам в ChromeDevTools в Твиттере, чтобы задать краткие вопросы, оставить отзыв или поделиться новыми идеями.
- Для более длительных обсуждений лучше всего подойдет список рассылки или Stack Overflow .
- По всем вопросам, связанным с документацией, откройте проблему в нашем репозитории документации.
- Вы всегда можете обратиться прямо к команде, чтобы сообщить об ошибке или запросить функцию в Crbug .
До следующего месяца,
Кейси