Что нового в DevTools (Chrome 108)

Джеселин Йин

Подсказки для неактивных свойств CSS

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

Подсказки для неактивных свойств CSS.

Проблема с Chromium: 1178508

Автоматическое определение XPath и текстовых селекторов на панели записи.

Панель записи теперь поддерживает XPath и текстовые селекторы. Начните запись пользовательского сценария , и программа записи автоматически выберет XPath и кратчайший уникальный текст элемента в качестве селектора, если таковой имеется.

В панели «Запись» есть селекторы XPath и текста.

Проблемы Chromium: 1327206 , 1327209

Пошагово просматривайте выражения, разделённые запятыми.

Теперь вы можете пошагово отлаживать выражения, разделенные запятыми. Это улучшает отладку минифицированного кода.

Пошагово просматривайте выражения, разделённые запятыми.

Ранее DevTools поддерживал только пошаговое выполнение выражений, разделенных точкой с запятой.

Учитывая приведенный ниже код,

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

Транспайлеры и минификаторы могут преобразовывать их в выражения, разделённые запятыми.

function bar(){return foo(),foo(),42}

Это создает путаницу во время отладки, поскольку поведение пошагового выполнения различается между минифицированным и исходным кодом. Еще большая путаница возникает при использовании карт исходного кода для отладки минифицированного кода относительно исходного кода, поскольку разработчик в этом случае видит точки с запятой (которые внутри системы были преобразованы в запятые инструментами), но отладчик на них не останавливается.

Проблема с Chromium: 1370200

Улучшена настройка списка игнорирования.

Перейдите в «Настройки» > «Список игнорируемых скриптов» . Инструменты разработчика улучшили дизайн, чтобы помочь вам настроить правила игнорирования отдельного скрипта или группы скриптов .

Вкладка «Список игнорирования».

Проблема с Chromium: 1356517

Различные важные моменты

В этом релизе внесены следующие существенные исправления:

  • Автозаполнение имени свойства CSS в панели «Стили» при нажатии пробела. ( 1343316 )
  • Удалить автоматическую прокрутку в навигационной цепочке панели элементов . ( 1369734 )

Загрузите предварительные каналы

Рекомендуем использовать Chrome Canary , Dev или Beta в качестве браузера по умолчанию для разработки. Эти предварительные версии предоставляют доступ к новейшим функциям DevTools, позволяют тестировать передовые API веб-платформ и помогают выявлять проблемы на вашем сайте до того, как их обнаружат пользователи!

Свяжитесь с командой Chrome DevTools

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

Что нового в инструментах разработчика

Список всего, что было рассмотрено в серии статей «Что нового в инструментах разработчика» .