Дайджест DevTools, октябрь 2016 г.

Эй-эй, Кейси снова здесь, чтобы получить еще один дайджест, чтобы рассказать вам о том, что нового в 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 на вкладке «Условия сети» .

Пользовательский агент UC Browser

Делиться значит заботиться

Как всегда, мы будем рады услышать ваши отзывы и идеи по поводу всего, что связано с DevTools.

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

До следующего месяца,

Кейси