Что нового в DevTools, Chrome 142

Маттиас Ромер

Предложения по коду от Gemini

Теперь вы можете получать подсказки автозаполнения, сгенерированные искусственным интеллектом, на панелях «Консоль» и «Источники» .

Функция подсказок кода на панелях «Консоль» и «Источники».

Чтобы включить эту функцию, перейдите в «Настройки» > «Инновации в области ИИ» и включите опцию «Предложения кода» .

Улучшения для сервера DevTools MCP.

С момента запуска публичной предварительной версии сервера DevTools MCP с версией 0.2.1 мы внесли различные улучшения благодаря вкладу сообщества и выпустили версию 0.9.0.

  • Поддержка Node.js расширена до версии Node.js 20.
  • Сетевые запросы и сообщения консоли можно разбивать на страницы для сохранения токенов и фильтровать по типу запроса (например, скрипты, таблицы стилей, изображения) и типу сообщения (журнал, предупреждение, ошибка).
  • Скриншоты можно сохранять в указанный путь и сохранять в различных форматах.
  • Настраиваемые категории инструментов позволяют организовать доступ к различным функциям, уменьшая ненужный информационный шум.
  • Теперь вы можете передавать аргументы запуска экземпляру Chrome, используемому сервером MCP.

Полный список изменений и исправлений ошибок можно найти в общедоступном журнале изменений на GitHub , а подробнее о сервере DevTools MCP можно узнать в сообщении в блоге, посвященном анонсу .

Более быстрый доступ к помощи ИИ.

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

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

Новая функция указывает на возможность использования ИИ в инструментах разработчика.

Отладка полной трассировки производительности с помощью Gemini.

После записи трассировки на панели «Производительность» вы можете обсудить с Gemini полную трассировку, связанные с ней данные о производительности и информацию о полях, не выбирая заранее конкретный контекст, — всё в рамках одного разговора. Это позволяет более комплексно оценить проблемы с производительностью, прежде чем углубляться в их изучение.

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

Аналогичным образом, все аналитические данные в разделе «Производительность > Аналитика» теперь доступны для обсуждения с Gemini.

Изменить ориентацию выдвижного ящика

Теперь выдвижную панель можно также переместить в сторону. Это позволяет просматривать панели рядом друг с другом, а не друг над другом. Щелкните правой кнопкой мыши по названию панели на главной панели вкладок и выберите «Переместить в выдвижную панель» , чтобы переместить выбранную панель в выдвижную панель.

Добавьте дополнительные панели в выдвижной ящик через ⋮ > Дополнительные инструменты.

В выдвижном ящике появился новый переключатель для изменения его ориентации.

Программа для разработчиков Google

Программа Google Developer Program теперь интегрирована в DevTools, с прямыми ссылками для управления профилем и получения новых значков.

Настройки профиля разработчика Google в параметрах инструментов разработчика

Значки — это функция, которую можно включить по желанию. Чтобы включить значки, перейдите в «Настройки» > «Предпочтения » > «Учетная запись» и включите опцию «Зарабатывать значки».

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

Вот лишь некоторые из многочисленных существенных исправлений и улучшений в этом выпуске:

  • В панели приложений теперь поддерживается проверка хранилища для всех типов сотрудников, включая обслуживающий персонал, сотрудников, работающих по совместительству, и сотрудников, работающих на выделенных позициях.
  • :target-current теперь отображается на панели «Стили» .
  • В панели управления сетью теперь можно фильтровать запросы на основе нового логического параметра Is ad-related .

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

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

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

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

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

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