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

Jecelyn Yeen

Примечание: Хотите помочь улучшить DevTools? Зарегистрируйтесь для участия в исследовании пользовательского опыта Google здесь .

Информация Web Vitals отображается на панели «Производительность».

Наведите курсор на маркер Web Vitals на панели «Производительность» , чтобы понять, что означает этот показатель — хорошая ли производительность, нуждается ли в улучшении или плохая.

Номер выпуска Chromium: 1147872

Визуализация CSS-эффекта привязки к прокрутке

Теперь вы можете включить или выключить значок scroll-snap на панели «Элементы» , чтобы проверить выравнивание привязки к прокрутке в соответствии с настройками CSS.

Когда к HTML-элементу на вашей странице (например, к этой демонстрационной странице) применяется scroll-snap-type , рядом с ним в панели «Элементы» отображается значок scroll-snap . Щелкните значок, чтобы включить или выключить отображение наложения scroll-snap на странице.

В приведенном выше примере вы можете увидеть точечные метки на краях привязки. Область прокрутки имеет сплошную обводку, а элементы привязки — пунктирную. Отступы прокрутки закрашены зеленым цветом, а поля прокрутки — оранжевым.

Номер выпуска Chromium: 862450

Новый инспектор памяти

Используйте новый инспектор памяти для проверки объекта ArrayBuffer в JavaScript, а также памяти Wasm.

Откройте эту демонстрационную страницу . В панели «Источники» откройте файл demo-js.js и установите точку останова на строке 18.

Обновите страницу. Разверните раздел «Область видимости» в правой панели отладчика . Обратите внимание на новый значок рядом со значением буфера . Щелкните по нему, чтобы открыть инспектор памяти .

Ознакомьтесь с документацией, чтобы узнать больше о проверке объектов JavaScript ArrayBuffer и WebAssembly.Memory с помощью этого нового инспектора памяти.

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

В панели «Элементы» появилась новая панель настроек значков.

Теперь вы можете выборочно включать или отключать значки в настройках значков на панели «Элементы» . Используйте эту функцию, чтобы настраивать и концентрироваться на важных значках при просмотре веб-страниц.

В панели «Элементы» щелкните правой кнопкой мыши по любому элементу. Выберите «Настройки значка» в контекстном меню; панель настроек значка появится вверху. Включите или отключите любой флажок, чтобы отображать/скрывать значки.

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

Улучшенный предварительный просмотр изображения с информацией о соотношении сторон.

В панели «Элементы» в предварительном просмотре изображений теперь отображается больше информации об изображении: размер в отрисованном виде, соотношение сторон в отрисованном виде, внутренний размер, внутреннее соотношение сторон и размер файла.

Эта информация поможет вам лучше понять ваши изображения и при необходимости применить оптимизацию.

Информация о соотношении сторон изображения также доступна на панели «Сеть» при предварительном просмотре изображения.

Проблемы Chromium: 1149832 , 1170656

Новая кнопка «Состояние сети» с параметрами для настройки Content-Encoding .

В панель «Сеть» добавлена ​​новая кнопка «Состояние сети». Нажмите на нее, чтобы открыть вкладку «Состояние сети» .

На вкладке «Условия сети» добавлена ​​новая опция «Принимаемые кодировки контента» . Настройте её, чтобы проверить, правильно ли кодируются ответы сервера в браузерах, которые не поддерживают gzip, brotli или другие будущие Content-Encoding .

Проблема Chromium: 1162042

Улучшения панели стилей

Новый ярлык для просмотра вычисленного значения на панели «Стили».

Теперь вы можете щелкнуть правой кнопкой мыши по свойству CSS на панели «Стили» и выбрать «Просмотреть вычисленное значение» , чтобы увидеть вычисленное значение CSS.

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

Поддержка ключевого слова accent-color

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

Свойство CSS accent-color в настоящее время является экспериментальным . Пожалуйста, включите chrome://flags/#enable-experimental-web-platform-features чтобы протестировать его.

Проблема Chromium: 1092093

Классифицируйте типы проблем с помощью цветов и значков.

Теперь вкладка «Проблемы» классифицирует проблемы по категориям: ошибки страниц, предстоящие критические изменения и возможные улучшения для более точной индикации серьезности. Вы можете открыть вкладку «Проблемы» , нажав на кнопку с количеством проблем в консоли .

• Ошибки страницы (красным цветом) . Проблемы, оказывающие непосредственное влияние на функциональность страницы, например, неправильная установка заголовков CORS и т. д.
• Предстоящие критические изменения (выделены желтым) . Информация о предстоящих несовместимых изменениях веб-платформы, которые могут привести к потере функциональности страницы (например, предупреждение о предстоящих изменениях в соответствии с CORS RFC 1918 ).
• Возможные улучшения (синим цветом) . Возможные улучшения страницы, которые в настоящее время не влияют на её основную функциональность (например, проблемы с доступностью).

Номер выпуска Chromium: 1183241

Удалить токены доверия

Теперь вы можете удалять токены доверия с помощью новой кнопки удаления на панели «Токены доверия» в разделе «Приложение» .

Trust Token — это новый API, помогающий бороться с мошенничеством и отличать ботов от реальных людей без пассивного отслеживания. Узнайте, как начать работу с Trust Tokens .

Номер выпуска Chromium: 1126824

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

Теперь вы можете просмотреть подробную информацию о заблокированных функциях в разделе «Политика разрешений» в окне сведений о фрейме.

Откройте эту демонстрационную страницу. Перейдите на панель «Приложение» и выберите фрейм. В разделе «Политика разрешений» прокрутите до свойства «Отключенные функции» . Нажмите «Показать подробности» , чтобы просмотреть информацию о причине блокировки функции. Щелкните значок рядом с каждой политикой, чтобы перейти к iframe или сетевому запросу, который заблокировал функцию.

Политика разрешений — это API веб-платформы, который позволяет веб-сайту разрешать или блокировать использование функций браузера в собственном фрейме или во встраиваемых им iframe-элементах.

Номер выпуска Chromium: 1158827

Фильтрация экспериментов в настройках «Эксперименты»

Новый фильтр экспериментов позволяет быстрее находить нужные эксперименты. Например, перейдите в «Настройки» > «Эксперименты» , в поле «Фильтр» введите «контраст», чтобы отфильтровать все эксперименты, содержащие слово «контраст».

В панели «Хранилище кэша» появился новый столбец Vary Header

Используйте новый столбец Vary Header на панели «Хранилище кэша» , чтобы просмотреть заголовок HTTP-ответа Vary .

Проблема Chromium: 1186049

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

Поддержка новых функций JavaScript

В инструментах разработчика теперь поддерживается новая функция проверки частной торговой марки в языке JavaScript, известная как #foo in obj .

Эта функция проверки частной торговой марки расширяет оператор in , позволяя проверять поля частного класса на любом заданном объекте.

Попробуйте это в панели «Консоль и источники» . Вы также можете просмотреть закрытые поля в разделе «Область видимости» в панели отладчика .

Выпуск Chromium: 11374

Расширенная поддержка отладки с использованием точек останова.

В инструментах разработчика теперь корректно устанавливаются точки останова в нескольких скриптах. Современные сборщики JavaScript (например, Webpack , Rollup ) поддерживают функцию разделения кода — существуют сценарии, когда один общий компонент может быть включен в несколько маршрутов (разделение кода).

Ранее DevTools позволял устанавливать точки останова только в одном месте. Благодаря последнему улучшению, DevTools теперь корректно устанавливает точки останова во всех соответствующих местах.

Проблемы Chromium: 1142705 , 979000 , 1180794

Поддержка предварительного просмотра при наведении курсора с использованием квадратных скобок []

В инструментах разработчика теперь поддерживается предварительный просмотр при наведении курсора на выражения-члены JavaScript, использующие обозначение [] в панели «Источники» .

Номер выпуска Chromium: 1178305

Улучшена структура HTML-файлов.

В инструментах разработчика теперь улучшена поддержка структуры HTML-файлов. На панели «Источники» откройте HTML-файл. Вы можете переключать отображение структуры кода с помощью сочетания клавиш Cmd + Shift + O на Mac или Ctrl + Shift + O в Windows.

В приведенном ниже примере инструменты разработчика теперь корректно отображают все функции в структуре проекта. Ранее инструменты разработчика показывали только некоторые из функций.

Проблема Chromium: 761019 , 1191465

Корректные трассировки стека ошибок для отладки Wasm.

В инструментах разработчика теперь обрабатываются встроенные вызовы функций и отображаются корректные трассировки стека ошибок для отладки Wasm.

Ранее в трассировке стека ошибок DevTools отображались только общие ссылки на Wasm.

В старой версии Chrome слева местоположение источника (например, dsquare ) не отображается в трассировке стека ошибок, тогда как в новой версии справа оно отображается.

Номер выпуска Chromium: 1189161

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

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

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

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

• Отправляйте нам свои отзывы и предложения по улучшению функционала на сайте crbug.com .
• Сообщить о проблеме в инструментах разработчика можно с помощью параметра more_vert. Дополнительные параметры > Справка > Сообщить о проблеме в инструментах разработчика .
• Напишите в Твиттере @ChromeDevTools .
• Оставляйте комментарии к видеороликам YouTube «Что нового в инструментах разработчика» или «Советы по инструментам разработчика» на YouTube .

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

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

Хром 143

• Обновления сервера DevTools MCP
• Улучшенное совместное использование трассировки
• Поддержка @starting-style
• Виджет редактора для отображения: кладка
• Маяк 13

Хром 142

• Предложения по коду от Gemini
• Улучшения для сервера DevTools MCP.
• Более быстрый доступ к помощи ИИ.
• Отладка полной трассировки производительности с помощью Gemini.
• Изменить ориентацию выдвижного ящика
• Программа для разработчиков Google
• Различные важные моменты

Хром 141

• Инструменты разработчика Chrome (MCP) для вашего ИИ-агента
• Отладка дерева сетевых зависимостей с помощью Gemini.
• Экспортируйте свои чаты с помощью Gemini
• Сохраненная конфигурация трека на панели «Производительность».
• Фильтрация сетевых запросов, защищенных IP-адресом.
• Вкладка «Элементы > Макет» добавляет поддержку макета «кирпичная кладка».
• Маяк 12.8.2
• Различные важные моменты

Хром 140

• Получите больше аналитической информации с помощью Gemini.
• В разделе «Сетевые условия» эмулируйте заголовок «Save-Data».
• Отображение базового состояния во всплывающей подсказке свойства CSS.
• Переопределение форм-факторов в подсказках клиентского пользовательского агента
• Маяк 12.8.0
• Различные важные моменты

Хром 139

• Более надежные и эффективные инструменты разработчика Chrome
• Загрузите изображения в систему помощи ИИ для создания стиля.
• Добавьте заголовки запроса в таблицу в разделе «Сеть».
• Ознакомьтесь с основными моментами конференции Google I/O 2025.
• Различные важные моменты

Хром 138

• Улучшения производительности панели
• Предварительно связанные истоки в анализе «дерева сетевых зависимостей»
• Время ответа сервера и время перенаправления в разделе «Задержка запроса документа»
• Перенаправления в сводке сетевых запросов
• Снижение уровня шума в графике производительности.
• Устаревшая функция «Отключить примеры JavaScript»
• Параметр точности геолокации в датчиках
• Улучшения панели элементов
• Упрощенная отладка сложных значений CSS.
• Поддержка @function в Элементах > Стили
• Улучшения сетевой панели
• has-request-header filter
• Прямые сокеты в изолированных веб-приложениях
• Различные важные моменты
• Доступность

Хром 137

• Google I/O 2025
• Изменяйте и сохраняйте изменения CSS в своем рабочем пространстве с помощью Gemini.
• Подключите папку рабочей области и сохраните изменения в исходных файлах.
• Обратитесь в Gemini за информацией об эффективности работы.
• Аннотируйте результаты анализа производительности с помощью Gemini.
• Добавляйте скриншоты в свои чаты с помощью Gemini.
• Новые данные в панели «Производительность»
• Дублированный JavaScript
• Устаревший JavaScript
• Теперь появились предположения, подтверждающие наличие тегов правил.
• Маяк 12.6.0
• Различные важные моменты
• Доступность

Хром 136

• Улучшения производительности панели
• Новые данные об эффективности
• Нажмите, чтобы выделить
• Время выполнения серверных запросов указано в сводке сетевых запросов.
• Фильтрация файлов cookie в разделе «Конфиденциальность и безопасность»
• Размеры указаны в единицах КБ в таблицах на разных панелях.
• Автозаполнение поддерживает corner-shape и corner-*-shape в разделе «Элементы > Стили».
• Экспериментальная функция: выявление проблем с элементами и атрибутами в DOM.
• Маяк 12.5.0
• Различные важные моменты

Хром 135

• Улучшения производительности панели
• Ссылки на источники и скрипты для вызовов профилей и функций в разделе «Производительность»
• LCP с поддержкой данных фазового поля
• Анализ дерева сетевых зависимостей
• В сводке вместо общего и личного времени указывается продолжительность.
• Подсветка наиболее тяжелого стека
• Улучшены состояния пустого пространства для различных панелей.
• Древовидное представление доступности в Elements
• Маяк 12.4.0
• Различные важные моменты

Хром 134

• Панель конфиденциальности и безопасности
• Улучшения производительности панели
• Откалиброванные предустановки регулирования производительности процессора
• Выберите различные события, связанные с производительностью, в одном и том же чате с использованием ИИ.
• Выделение результатов поиска по ключевым словам и сторонним сервисам в разделе «Производительность».
• Полевые данные во всплывающих подсказках и аналитических отчетах по маркерам.
• Информация о принудительном переформатировании
• Информация по оптимизации размера DOM
• Расширьте трассировку производительности с помощью console.timeStamp.
• Улучшения панели элементов
• Значения анимированных стилей в реальном времени
• Поддержка псевдокласса `:open` и различных псевдоэлементов.
• Скопировать все сообщения консоли
• Байтовые единицы на панели «Память»
• Различные важные моменты

Хром 133

• Постоянная история чата с использованием ИИ
• Улучшения производительности панели
• Анализ доставки изображений
• Классическая и современная навигация с помощью клавиатуры
• Игнорируйте нерелевантные скрипты на диаграмме пламени.
• Маркеры временной шкалы и подсветка диапазона при наведении курсора
• Рекомендуемые настройки регулирования скорости
• Временные метки наложены
• Трассировка стека вызовов JavaScript в сводке
• Настройки значка перемещены в меню Elements.
• Новая панель «Что нового»
• Маяк 12.3.0
• Различные важные моменты

Хром 132

• Отладка сетевых запросов, исходных файлов и трассировок производительности с помощью Gemini.
• Просмотреть историю чата с использованием ИИ.
• Управление хранилищем расширений осуществляется в разделе «Приложения» > «Хранилище».
• Улучшения производительности
• Фазы взаимодействия в метриках реального времени
• Информация о блокировке рендеринга находится на вкладке «Сводка».
• Поддержка событий scheduler.postTask и стрелок-инициаторов для них.
• Улучшения в панели «Анимация» и вкладке «Элементы > Стили».
• Перейти из раздела «Элементы» > «Стили» в раздел «Анимация».
• Обновления в режиме реального времени на вкладке «Вычисления».
• Вычисление эмуляции давления в датчиках
• Объекты JavaScript с одинаковым именем сгруппированы по источнику на панели «Память».
• Новый дизайн настроек
• Панель анализа производительности устарела и удалена из инструментов разработчика.
• Различные важные моменты

Хром 131

• Отладка CSS с помощью Gemini
• Управляйте функциями ИИ на специальной вкладке настроек.
• Улучшения производительности панели
• Аннотируйте и делитесь результатами анализа производительности.
• Получайте аналитические данные о производительности прямо на панели «Производительность».
• Обнаружить чрезмерные изменения в компоновке проще.
• Найдите некомпозитные анимации.
• Аппаратная параллельность переносится на датчики.
• Игнорируйте анонимные скрипты и сосредоточьтесь на своем коде в трассировках стека.
• Элементы > Стили: Поддержка режимов написания с боковым * для наложений сетки и ключевых слов, используемых во всем CSS.
• Аудит Lighthouse для страниц, не использующих протокол HTTP, в режимах временного интервала и снимка.
• Улучшения доступности
• Различные важные моменты

Хром 130

• Улучшения сетевой панели
• Переосмысление сетевых фильтров
• Теперь при экспорте HAR по умолчанию исключаются конфиденциальные данные.
• Улучшения панели элементов
• Значения автозаполнения для свойств text-embassis-*
• Переполнение при прокрутке отмечено значком
• Улучшения производительности панели
• Рекомендации в режиме реального времени на основе метрик
• Перемещайтесь по хлебным крошкам
• Улучшения панели памяти
• Новый профиль «Отдельно стоящие элементы».
• Улучшено именование простых объектов JavaScript.
• Отключите динамическое оформление.
• Эксперимент Chrome: совместное использование процессов
• Маяк 12.2.1
• Различные важные моменты

Хром 129

• Программа записи экрана поддерживает экспорт в Puppeteer для Firefox.
• Улучшения производительности панели
• Наблюдения за показателями в реальном времени
• Поисковые запросы в разделе «Сеть»
• См. трассировку стека вызовов performance.mark и performance.measure.
• Используйте тестовые данные адреса в панели автозаполнения.
• Улучшения панели элементов
• Принудительное добавление состояний для конкретных элементов
• В разделе «Элементы > Стили» теперь автоматически заполняется больше свойств сетки.
• Маяк 12.2.0
• Различные важные моменты

Хром 128

• Аналитические функции консоли от Gemini становятся доступны в большинстве европейских стран.
• Обновления панели производительности
• Расширенная сетевая дорожка
• Настраивайте данные о производительности с помощью API расширяемости.
• Подробности в разделе «Время проведения».
• Скопируйте все перечисленные запросы в панели «Сеть».
• Более быстрые снимки состояния кучи с использованием именованных HTML-тегов и меньшим количеством лишнего контента.
• Откройте панель «Анимация», чтобы захватывать анимации и редактировать ключевые кадры в режиме реального времени.
• Маяк 12.1.0
• Улучшения доступности
• Различные важные моменты

Хром 127

• Проверьте позиционирование ссылок CSS в панели «Элементы».
• Улучшения панели источников
• Улучшенная версия "Никогда не делайте здесь паузу"
• Новые обработчики событий привязки прокрутки
• Улучшения сетевой панели
• Обновлены настройки регулирования сети.
• Информация о сотруднике службы поддержки в пользовательских полях формата HAR
• Отправляйте и получайте события WebSocket на панели «Производительность».
• Различные важные моменты

Хром 126

• Улучшения производительности панели
• Перемещайте и скрывайте рельсы с помощью обновленного режима настройки рельсов.
• Игнорировать скрипты на диаграмме пламени
• Снизить производительность процессора в 20 раз.
• Панель анализа производительности будет упразднена.
• Обнаружение чрезмерного использования памяти с помощью новых фильтров в снимках кучи.
• Проверьте разделы хранилища в разделе «Приложение» > «Хранилище».
• Отключите предупреждения о самоуязвимости XSS с помощью флага командной строки.
• Маяк 12.0.0
• Различные важные моменты

Хром 125

• С Gemini вы сможете лучше понимать ошибки и предупреждения в консоли.
• Поддержка правил @position-try в разделе «Элементы > Стили».
• Улучшения панели источников
• Настройте автоматическую форматированную печать и закрытие скобок.
• Обработанные отклоненные обещания помечаются как перехваченные.
• Причины ошибок в консоли
• Улучшения сетевой панели
• Проверьте заголовки Early Hints.
• Скрыть колонку «Водопад»
• Улучшения производительности панели
• Сбор статистики по CSS-селекторам
• Изменить порядок и скрыть следы
• Игнорировать элементы управления в панели «Память»
• Маяк 11.7.1
• Различные важные моменты

Хром 124

• Новая панель автозаполнения
• Улучшенное регулирование скорости сети для WebRTC.
• Поддержка анимаций, управляемых прокруткой, в панели «Анимации».
• Улучшена поддержка вложенности CSS в разделе «Элементы > Стили».
• Панель повышения производительности
• Скрыть функции и их дочерние элементы на диаграмме пламени.
• Стрелки от выбранных инициаторов к событиям, которые они инициировали.
• Маяк 11.6.0
• Всплывающие подсказки для специальных категорий в разделе Память > Снимки кучи
• Приложение > Обновления хранилища
• Байты, используемые для общего хранилища
• Web SQL полностью устарел.
• Улучшения в работе панели покрытия.
• Панель «Слои» может быть устаревшей.
• Прекращение поддержки JavaScript Profiler: четвертый этап, заключительный
• Различные важные моменты

Хром 123

• Найдите пасхальное яйцо
• Обновления панели элементов
• Имитация активной страницы в разделе «Элементы > Стили»
• Палитра цветов, часы углов и редактор сглаживания доступны в качестве резервных вариантов в функции var()
• Инструмент CSS length устарел.
• Всплывающее окно для выбранного результата поиска в разделе «Производительность > Основной трек»
• Обновления сетевой панели
• Кнопка «Очистить» и фильтр поиска на вкладке «Сеть» > «Поток событий»
• Всплывающие подсказки с указанием причин исключения сторонних файлов cookie в разделе «Сеть > Файлы cookie».
• Включать и отключать все точки останова в исходном коде.
• Просмотр загруженных скриптов в инструментах разработчика для Node.js
• Маяк 11.5.0
• Улучшения доступности
• Различные важные моменты

Хром 122

• Официальная коллекция расширений для Recorder уже доступна.
• Улучшения сети
• Причина сбоя указана в столбце «Статус».
• Улучшенное подменю «Копировать»
• Улучшения производительности
• Хлебные крошки на временной шкале
• Инициаторы мероприятий в основной сетке
• Меню выбора экземпляра виртуальной машины JavaScript для инструментов разработчика Node.js
• В разделе «Источники» появилась новая комбинация клавиш и команда.
• Улучшения элементов
• Псевдоэлемент ::view-transition теперь можно редактировать в стилях.
• Поддержка свойства align-content для блочных контейнеров
• Поддержка осанки для эмулируемых складных устройств
• Динамическое оформление тем
• Предупреждения о прекращении использования сторонних файлов cookie в панелях «Сеть» и «Приложения».
• Маяк 11.4.0
• Улучшения доступности
• Различные важные моменты

Хром 121

• Улучшения элементов
• Упрощенная панель фильтров в панели «Сеть».
• @font-palette-values ​​поддержка
• Поддерживаемый случай: Использование пользовательского свойства в качестве резервного варианта для другого пользовательского свойства.
• Улучшена поддержка карт исходного кода.
• Улучшения производительности панели
• Расширенные возможности взаимодействия (трек)
• Расширенная фильтрация на вкладках «Снизу вверх», «Дерево вызовов» и «Журнал событий».
• Маркеры отступов на панели «Источники».
• Полезные всплывающие подсказки для переопределенных заголовков и содержимого на панели «Сеть».
• Новые параметры командного меню для добавления и удаления шаблонов блокировки запросов.
• Эксперимент с нарушениями CSP отменен.
• Маяк 11.3.0
• Улучшения доступности
• Различные важные моменты

Хром 120

• Поэтапное прекращение использования сторонних файлов cookie
• Проанализируйте файлы cookie вашего веб-сайта с помощью инструмента анализа конфиденциальности Privacy Sandbox.
• Расширенный список игнорируемых объектов
• Шаблон исключения по умолчанию для node_modules
• Теперь перехваченные исключения останавливают выполнение, если они перехвачены или проходят через неигнорируемый код.
• В исходных картах x_google_ignoreList переименована в ignoreList
• Новая функция переключения режима ввода во время удаленной отладки.
• На панели «Элементы» теперь отображаются URL-адреса для узлов #document.
• Эффективная политика безопасности контента в панели приложения
• Улучшена отладка анимации.
• Диалоговое окно «Вы доверяете этому коду?» в исходном коде и предупреждение о самоуязвимости XSS в консоли.
• Точки останова обработчиков событий в веб-воркерах и воллетах
• Новый значок для медиаконтента ( <audio> и <video> .
• Предварительная загрузка переименована в Спекулятивную загрузку.
• Маяк 11.2.0
• Улучшения доступности
• Различные важные моменты

Хром 119

• Улучшен раздел @property в Elements > Styles.
• Редактируемое правило @свойства
• Сообщается о проблемах, связанных с некорректными правилами @property.
• Обновленный список устройств для эмуляции.
• Красивое форматирование JSON непосредственно в тегах <script> в исходном коде
• Автозаполнение закрытых полей в консоли
• Маяк 11.1.0
• Улучшения доступности
• Прекращение поддержки Web SQL
• Проверка соотношения сторон скриншота в разделе «Приложение > Манифест».
• Различные важные моменты

Хром 118

• Новый раздел для пользовательских свойств в Elements > Styles.
• Дополнительные улучшения в области локальных переопределений.
• Расширенный поиск
• Улучшенная панель «Источники»
• Упрощенное рабочее пространство на панели «Источники».
• Изменить порядок панелей в разделе «Источники»
• Подсветка синтаксиса и форматированный вывод для большего количества типов скриптов.
• Имитация функции воспроизведения медиаконтента с пониженной прозрачностью
• Маяк 11
• Улучшения доступности
• Различные важные моменты

Хром 117

• Улучшения сетевой панели
• Еще быстрее перезаписывайте веб-контент локально.
• Переопределяйте содержимое XHR-запросов и запросов на получение данных.
• Скрыть запросы на расширение Chrome
• Удобочитаемые коды состояния HTTP

• Отформатированные ответы для подтипов JSON

• Производительность: см. изменения в приоритете получения сетевых событий.

• В настройках источников по умолчанию включены: сворачивание кода и автоматическое отображение файлов.
• Улучшена отладка проблем, связанных с файлами cookie сторонних разработчиков.
• Новые цвета
• Маяк 10.4.0
• Предварительная загрузка отладки в панели приложения.
• Расширение для отладки C/C++ WebAssembly в DevTools теперь имеет открытый исходный код.
• Различные важные моменты
• (Экспериментальная) Новая эмуляция рендеринга: prefers-reduced-transparency
• (Экспериментальный) Усовершенствованный монитор протокола

Хром 116

• Улучшена отладка отсутствующих таблиц стилей.
• Поддержка линейного тайминга в разделе Элементы > Стили > Редактор сглаживания
• Поддержка сегментов хранилища и просмотр метаданных
• Маяк 10.3.0
• Доступность: сочетания клавиш и улучшенная функция чтения с экрана.
• Различные важные моменты

Хром 115

• Улучшения элементов
• Новый значок CSS-подсетки
• Специфичность селектора во всплывающих подсказках
• Значения пользовательских свойств CSS во всплывающих подсказках
• Улучшения источников
• Подсветка синтаксиса CSS
• Быстрый способ установки условных точек останова
• Приложение > Меры по предотвращению отказов при отслеживании посещений
• Маяк 10.2.0
• По умолчанию игнорировать скрипты содержимого.
• Сеть > Улучшения скорости отклика
• Различные важные моменты

Хром 114

• Поддержка отладки WebAssembly
• Улучшено пошаговое выполнение кода в приложениях Wasm.
• Отладка автозаполнения с помощью панели «Элементы» и вкладки «Проблемы».
• Утверждения в регистраторе
• Маяк 10.1.1
• Улучшения производительности
• Функция performance.mark() отображает время выполнения при наведении курсора в разделе «Производительность > Время выполнения».
• Команда profile() заполняет раздел «Производительность > Главная».
• Предупреждение о медленной реакции пользователя
• Обновления Web Vitals
• Прекращение поддержки JavaScript Profiler: третий этап
• Различные важные моменты

Хром 113

• Переопределение заголовков сетевого ответа
• Улучшения в отладке Nuxt, Vite и Rollup.
• Улучшения CSS в разделе «Элементы > Стили».
• Недопустимые свойства и значения CSS.
• Ссылки на ключевые кадры в сокращенном описании анимации
• Новая настройка консоли: автозаполнение при нажатии клавиши Enter.
• Меню команд акцентирует внимание на созданных файлах.
• Прекращение поддержки JavaScript Profiler: второй этап
• Различные важные моменты

Хром 112

• Обновления регистратора
• Расширения для воспроизведения записи
• Запись с использованием селекторов прокола
• Экспорт записей в виде скриптов Puppeteer с анализом в Lighthouse.
• Получите расширения для Recorder
• Элементы > Обновления стилей
• Документация по CSS находится в панели «Стили».
• Поддержка вложенности CSS
• Отметка точек логирования и условных точек останова в консоли.
• Во время отладки игнорируйте нерелевантные скрипты.
• Началось прекращение поддержки JavaScript Profiler.
• Имитация пониженного контраста
• Маяк 10
• Различные важные моменты

Хром 111

• Отладка цветопередачи в HD-качестве с помощью панели «Стили».
• Улучшен пользовательский интерфейс точек останова
• Настраиваемые ярлыки для записи экрана
• Улучшена подсветка синтаксиса для Angular.
• Настройте порядок кэша в панели приложений.
• Различные важные моменты

Хром 110

• Очистка панели производительности при перезагрузке
• Обновления регистратора
• Просмотрите и выделите код вашего пользовательского сценария в окне записи.
• Настройка типов селекторов записи
• Редактируйте сценарий взаимодействия пользователя во время записи.
• Автоматическая печать красивых изображений на месте
• Улучшенная подсветка синтаксиса и встроенный предварительный просмотр для Vue, SCSS и других сервисов.
• Эргономичная и надежная функция автозаполнения в консоли.
• Различные важные моменты

Хром 109

• Запись: Копировать как параметры для шагов, воспроизведение на странице, контекстное меню шага.
• Отображение фактических названий функций в записях исполнения.
• Новые сочетания клавиш на панели «Консоль и источники».
• Улучшена отладка JavaScript.
• Различные важные моменты
• [Экспериментальная версия] Улучшен пользовательский интерфейс при управлении точками останова
• [Экспериментальная] Автоматическая печать изображений на месте

Хром 108

• Подсказки для неактивных свойств CSS
• Автоматическое определение XPath и текстовых селекторов на панели записи.
• Пошагово просматривайте выражения, разделённые запятыми.
• Улучшена настройка списка игнорирования.
• Различные важные моменты

Хром 107

• Настройка сочетаний клавиш в инструментах разработчика
• Переключайте светлую и темную темы с помощью сочетания клавиш.
• Выделение объектов C/C++ в инспекторе памяти.
• Поддержка полной информации об инициаторе для импорта HAR.
• Начать поиск в DOM после нажатия клавиши Enter
• Отображение start и end значков для свойства CSS flexbox align-content
• Различные важные моменты

Хром 106

• В панели «Источники» сгруппируйте файлы по дате создания/развертывания.
• Связанные трассировки стека для асинхронных операций
• Автоматически игнорировать известные сторонние скрипты
• Улучшен стек вызовов во время отладки.
• Скрытие источников, помеченных как игнорируемые, на панели «Источники».
• Скрытие файлов, внесенных в список игнорируемых, в командном меню.
• Новая ветка «Взаимодействия» на панели «Производительность».
• Анализ временных характеристик LCP на панели «Аналитика производительности»
• Автоматическое создание имени по умолчанию для записей на панели «Запись».
• Различные важные моменты

Хром 105

• Пошаговое воспроизведение в программе записи
• Поддержка события наведения мыши на панель записи экрана.
• Крупнейший объект Contentful Paint (LCP) на панели анализа производительности.
• Выявите кратковременные всплески текста (FOIT, FOUT) как потенциальные причины изменений в макете.
• Обработчики протоколов в панели «Манифест»
• Значок верхнего слоя на панели «Элементы».
• Подключайте отладочную информацию Wasm во время выполнения.
• Поддержка редактирования в режиме реального времени во время отладки.
• Просматривайте и редактируйте правила @scope в панели «Стили».
• Улучшения карты исходного кода
• Различные важные моменты

Хром 104

• Перезапуск кадра во время отладки
• Параметры замедленного воспроизведения на панели «Запись».
• Создайте расширение для панели записи экрана.
• В панели «Источники» сгруппируйте файлы по дате создания/развертывания.
• Отслеживание времени работы новых пользователей отображается на панели «Аналитика производительности».
• Отобразить назначенный слот элемента
• Имитация аппаратной параллельности для записи производительности
• Предварительный просмотр значений, не относящихся к цвету, при автозаполнении переменных CSS.
• Найдите блокирующие кадры в панели кэша "Назад/Вперед".
• Улучшены подсказки автозаполнения для объектов JavaScript.
• Улучшения карт исходного кода
• Различные важные моменты

Хром 103

• Записывайте события двойного щелчка и щелчка правой кнопкой мыши на панели «Рекордер».
• В панели Lighthouse появились новый временной интервал и режим моментального снимка.
• Улучшено управление масштабированием на панели «Аналитика производительности».
• Подтвердите удаление записи выступления.
• Изменяйте порядок панелей на панели «Элементы».
• Выбор цвета вне браузера
• Улучшен предварительный просмотр значений в режиме отладки.
• Поддержка больших блоков данных для виртуальных аутентификаторов
• Новые сочетания клавиш на панели «Источники».
• Улучшения карт исходного кода

Хром 102

• Функция предварительного просмотра: новая панель анализа производительности.
• Новые сочетания клавиш для имитации светлой и темной тем оформления.
• Улучшена безопасность на вкладке «Предварительный просмотр сети».
• Улучшена перезарядка в точке перелома.
• Обновления консоли
• Отменить запись пользовательского сценария в начале.
• Отображение унаследованных псевдоэлементов подсветки в панели «Стили».
• Различные важные моменты
• [Экспериментальная версия] Копирование изменений CSS
• [Экспериментальная версия] Выбор цвета вне браузера

Хром 101

• Импорт и экспорт записанных пользовательских сценариев в виде JSON-файла.
• Отображение каскадных слоев в панели «Стили».
• Поддержка цветовой функции hwb()
• Улучшена демонстрация частной собственности.
• Различные важные моменты
• [Экспериментальная версия] Новый временной интервал и режим моментального снимка в панели «Маяк».

Хром 100

• Просматривайте и редактируйте правила @supports в панели «Стили».
• Поддержка распространенных селекторов по умолчанию.
• Настройте селектор записи
• Переименовать запись
• Предварительный просмотр свойств класса/функции при наведении курсора
• Частично отображаемые кадры на панели «Производительность»
• Различные важные моменты

Хром 99

• Ограничение количества запросов WebSocket
• Новая панель API для создания отчетов в панели приложений.
• Поддержка: дождитесь, пока элемент станет видимым/кликабельным на панели записи.
• Улучшенное оформление, форматирование и фильтрация консоли.
• Расширение для отладки Chrome с файлами карты исходного кода
• Улучшена структура папок с исходными файлами на панели «Источники».
• Отображение исходных файлов рабочих процессов на панели «Источники».
• Обновления автоматической темной темы Chrome
• Удобная сенсорная панель выбора цвета и разделенное окно
• Различные важные моменты

Хром 98

• Функция предварительного просмотра: Полностраничное дерево доступности
• Более точные изменения доступны на вкладке «Изменения».
• Установите более длительный тайм-аут для записи пользовательского потока.
• Убедитесь, что ваши страницы кэшируются, используя вкладку «Кэширование» (Назад/Вперед)
• Новый фильтр панели свойств
• Имитация функции принудительного выбора цветов в CSS для работы с медиафайлами.
• Отображать линейки при наведении курсора
• Поддерживается row-reverse и column-reverse в редакторе Flexbox.
• Новые сочетания клавиш для воспроизведения XHR-запросов и развертывания всех результатов поиска.
• Маяк № 9 на панели «Маяк»
• Улучшенная панель «Источники»
• Различные важные моменты
• [Экспериментальные] Конечные точки на панели API отчетов

Хром 97

• Предварительный просмотр функции: Новая панель записи
• Обновите список устройств в режиме устройства.
• Автозаполнение с возможностью редактирования в формате HTML
• Улучшена отладка кода.
• Синхронизация настроек инструментов разработчика между устройствами.

Хром 96

• Функция предварительного просмотра: новая панель обзора CSS.
• Восстановлен и улучшен интерфейс редактирования длины CSS и копирования текста.
• Имитация функции CSS prefers-contrast для работы с медиафайлами
• Имитация функции автоматической темной темы Chrome
• Скопируйте объявления как JavaScript в панели «Стили».
• В панели «Сеть» появилась новая вкладка «Полезная нагрузка».
• Улучшено отображение свойств в панели «Свойства».
• Возможность скрыть ошибки CORS в консоли.
• Предварительный просмотр и оценка Intl объектов в консоли.
• Согласованные трассировки стека асинхронных операций
• Сохраните боковую панель «Консоль».
• Устаревшая панель кэширования приложений в панели приложений.
• [Экспериментальная версия] Новая панель API для создания отчетов в панели приложения.

Хром 95

• Новые инструменты для создания CSS-стилей с указанием длины
• Скрыть проблемы на вкладке «Проблемы»
• Улучшено отображение свойств.
• Маяк 8.4 на панели «Маяк»
• Сортируйте фрагменты текста на панели «Источники».
• Новые ссылки на переведённые примечания к выпуску и форму сообщения об ошибке перевода.
• Улучшен пользовательский интерфейс меню командных инструментов разработчика.

Хром 94

• Используйте инструменты разработчика на предпочитаемом вами языке.
• Новые устройства Nest Hub в списке устройств
• Исходные испытания отображаются в подробном представлении Frame.
• Новый значок запроса контейнера CSS
• Новый флажок для инвертирования сетевых фильтров.
• В ближайшее время боковая панель консоли будет упразднена.
• Отображение необработанных заголовков Set-Cookies на вкладке «Проблемы» и панели «Сеть».
• Последовательное отображение собственных методов доступа в качестве отдельных свойств в консоли.
• Корректные трассировки стека ошибок для встроенных скриптов с использованием #sourceURL
• Измените формат цвета в панели «Вычисления».
• Замените пользовательские всплывающие подсказки на стандартные HTML-подсказки.
• [Экспериментальная функция] Скрытие проблем на вкладке «Проблемы»

Хром 93

• Редактируемые CSS-контейнерные запросы в панели «Стили».
• Предварительный просмотр веб-пакета на панели «Сеть».
• Отладка API для составления отчетов об атрибуции
• Улучшена обработка строк в консоли.
• Улучшена отладка CORS.
• Маяк 8.1
• Новый URL-адрес заметки в панели «Манифест».
• Исправлены селекторы соответствия CSS.
• Форматирование JSON-ответов на панели «Сеть»

Хром 92

• редактор CSS-сеток
• Поддержка повторного объявления const в консоли
• Просмотрщик порядка источников
• Новый ярлык для просмотра подробностей кадра.
• Расширенная поддержка отладки CORS
• Переименуйте метку XHR в Fetch/XHR.
• Отфильтруйте типы ресурсов Wasm на панели «Сеть».
• Подсказки клиента User-Agent для устройств на вкладке «Состояние сети»
• Сообщайте о проблемах в режиме "Особенности" на вкладке "Проблемы".
• Включите вычислительные пересечения на панели «Производительность».
• Маяк 7.5 на панели «Маяк»
• Устаревшее контекстное меню «Перезапуск кадра» в стеке вызовов.
• [Экспериментальный] Монитор протокола
• [Экспериментальный] диктофон для кукловодов

Хром 91

• Всплывающая информация Web Vitals
• Новый инспектор памяти
• Визуализация CSS-эффекта привязки к прокрутке
• Новая панель настроек значка
• Улучшенный предварительный просмотр изображения с информацией о соотношении сторон.
• Новая кнопка «Состояние сети» с параметрами для настройки Content-Encoding .
• ярлык для просмотра вычисленного значения
• ключевое слово accent-color
• Классифицируйте типы проблем с помощью цветов и значков.
• Удалить токены доверия
• Заблокированные функции в окне сведений о фрейме
• Фильтрация экспериментов в настройках «Эксперименты»
• В панели «Хранилище кэша» появился новый столбец Vary Header
• Поддержка проверки частной торговой марки на JavaScript
• Расширенная поддержка отладки с использованием точек останова.
• Поддержка предварительного просмотра при наведении курсора с использованием квадратных скобок []
• Улучшена структура HTML-файлов.
• Корректные трассировки стека ошибок для отладки Wasm.

Хром 90

• Новые инструменты отладки CSS flexbox
• Новое наложение основных веб-функций
• Переместил счетчик проблем в строку состояния консоли.
• Сообщить о проблемах с доступом к доверенным веб-ресурсам
• Форматирование строк как (допустимых) строковых литералов JavaScript в консоли.
• В панели приложений появилась новая панель «Доверенные токены».
• Имитация функции CSS color-gamut media
• Улучшенные инструменты для прогрессивных веб-приложений
• В панели «Сеть» появился новый столбец Remote Address Space .
• Улучшения производительности
• Отображение разрешенных/запрещенных функций в окне сведений о раме.
• В панели «Cookies» появился новый столбец SameParty .
• Устаревшая нестандартная поддержка fn.displayName
• Отключена функция « Don't show Chrome Data Saver warning в меню настроек.
• [Экспериментальная функция] Автоматическое создание отчетов о проблемах с низким контрастом на вкладке «Проблемы».
• [Экспериментальная версия] Полное отображение дерева доступности на панели «Элементы»

Хром 89

• Поддержка отладки нарушений, связанных с доверенными типами.
• Сделать снимок экрана узла за пределами области просмотра.
• Новая вкладка «Доверенные токены» для сетевых запросов.
• Маяк №7 на панели «Маяк»
• Поддержка принудительного использования состояния CSS :target
• Новый ярлык для дублирования элемента
• Палитры цветов для пользовательских свойств CSS
• Новые сочетания клавиш для копирования свойств CSS.
• Новая опция для отображения файлов cookie, декодированных из URL-адреса.
• Удалять только видимые файлы cookie
• В разделе «Хранилище» появилась новая опция для удаления сторонних файлов cookie.
• Редактировать подсказки клиента User-Agent для пользовательских устройств
• Сохранить настройку "записывать сетевой журнал".
• Просмотр подключений WebTransport осуществляется на панели «Сеть».
• Терминал «Онлайн» переименован в «Без ограничения скорости».
• Новые параметры копирования в консоли, панели «Источники» и панели «Стили».
• Информация о новых работниках сферы услуг в подробном представлении структуры.
• Информация об объеме памяти отображается в окне сведений о кадре.
• Оставьте свой отзыв во вкладке "Проблемы".
• В панели «Производительность» наблюдается выпадение кадров.
• Эмуляция складных устройств и двухэкранных режимов в режиме устройства.
• [Экспериментальная версия] Автоматизация тестирования браузера с помощью Puppeteer Recorder
• [Экспериментальная] Редактор шрифтов в панели «Стили»
• [Экспериментальные] Инструменты отладки CSS flexbox
• [Экспериментальная] Новая вкладка «Нарушения CSP»
• [Экспериментальная версия] Новый алгоритм расчета цветового контраста — Усовершенствованный алгоритм перцептивного контраста (APCA)

Хром 88

• Быстрый старт с использованием DevTools
• Новые инструменты визуализации углов CSS
• Эмуляция неподдерживаемых типов изображений
• Имитируйте размер квоты хранения на панели «Хранилище».
• В панели «Производительность» появилась новая полоса «Web Vitals».
• Сообщайте об ошибках CORS в панели «Сеть».
• Информация о междоменной изоляции в представлении сведений о кадре.
• Информация о новых веб-воркерах отображается в подробном представлении фрейма.
• Отображение сведений о рамке открывающегося окна.
• Откройте панель «Сеть» из панели «Сервисные работники».
• Скопировать значение свойства
• Скопировать трассировку стека для сетевого инициатора
• Предварительный просмотр значения переменной Wasm при наведении курсора мыши
• Оцените переменную Wasm в консоли.
• Единые единицы измерения для размеров файлов/памяти
• Выделите псевдоэлементы на панели «Элементы».
• [Экспериментальные] инструменты отладки CSS Flexbox
• [Экспериментальная версия] Настройка сочетаний клавиш для аккордов

Хром 87

• Новые инструменты отладки CSS Grid
• Новая вкладка WebAuthn
• Перемещайте инструменты между верхней и нижней панелями.
• В панели «Стили» появилась новая боковая панель «Вычисляемые элементы».
• Группировка свойств CSS на панели «Вычисляемые»
• Маяк 6.3 на панели «Маяк»
• События performance.mark() в разделе Timings
• В панели «Сеть» появились новые фильтры resource-type и url .
• Обновления отображения подробной информации о кадре
• Прекращение поддержки Settings в меню «Дополнительные инструменты».
• [Экспериментальная функция] Просмотр и исправление проблем с цветовым контрастом на панели «Обзор CSS».
• [Экспериментальная функция] Настройка сочетаний клавиш в инструментах разработчика

Хром 86

• Панельная дискуссия по новым медиа
• Создавайте снимки экрана узлов с помощью контекстного меню панели «Элементы».
• Обновления вкладки «Проблемы»
• Имитация отсутствующих локальных шрифтов
• Имитация неактивных пользователей
• Emulate prefers-reduced-data
• Поддержка новых функций JavaScript
• Маяк 6.2 на панели «Маяк»
• Удалена возможность отображения раздела «другие источники происхождения» в панели «Работники сферы услуг».
• Показать сводку покрытия для отфильтрованных элементов
• Новый режим просмотра сведений о фрейме в панели приложений.
• Доступные варианты цветовых решений в панели «Стили».
• Восстановить свойства (панель «Элементы»)
• Удобочитаемые значения заголовка X-Client-Data на панели «Сеть».
• Автозаполнение пользовательских шрифтов в панели «Стили».
• Единообразное отображение типа ресурса на панели «Сеть»
• Кнопки очистки на панелях «Элементы» и «Сеть»

Хром 85

• Редактирование стилей для CSS-in-JS фреймворков
• Маяк №6 на панели «Маяк»
• Первая значимая амортизация краски (FMP)
• Поддержка новых функций JavaScript
• В панели «Манифест» появились предупреждения о новых ярлыках приложений.
• События Service Worker respondWith отображаются на вкладке «Время».
• Единообразное отображение панели «Вычисления»
• Смещения байт-кода для файлов WebAssembly
• Построчное копирование и вырезание в панели «Источники».
• Обновления настроек консоли
• Обновления панели производительности
• Новые значки для точек останова, условных точек останова и точек логирования.

Хром 84

• Исправляйте ошибки на сайте с помощью новой вкладки «Проблемы».
• Информация о доступности отображается во всплывающей подсказке в режиме «Проверить элемент».
• Обновления панели производительности
• Более точная терминология обещаний в консоли.
• Обновления панели стилей
• Прекращение поддержки панели «Свойства» в панели «Элементы».
• Поддержка ярлыков приложений в панели «Манифест».

Хром 83

• Имитация нарушений зрения
• Имитация локаций
• Отладка политики встраивания из разных источников (COEP)
• Новые значки для точек останова, условных точек останова и точек логирования.
• Просмотрите сетевые запросы, которые устанавливают определенный cookie-файл.
• Прикрепите панель слева из командного меню.
• Пункт «Настройки» в главном меню перемещен.
• Комитет по аудиту теперь называется «Комитет маяка».
• Удалите все локальные переопределения в папке.
• Обновлен пользовательский интерфейс для длительных задач.
• Поддержка маскируемых значков в панели «Манифест».

Хром 82

Выпуск Chrome 82 был отменен .

Хром 81

• Поддержка Moto G4 в режиме устройства
• Обновления, касающиеся файлов cookie.
• Более точные значки манифеста веб-приложения
• Наведите курсор на свойства content CSS, чтобы увидеть значения без экранирования.
• Ошибки карты исходного кода в консоли
• Настройка для отключения прокрутки за конец файла.

Хром 80

• Поддержка повторного объявления операторов let и class в консоли.
• Улучшена отладка WebAssembly.
• Запросите цепочки инициаторов на вкладке «Инициатор».
• Выделите выбранный сетевой запрос в разделе «Обзор».
• Столбцы URL и пути на панели «Сеть»
• Обновлены строки User-Agent.
• Новый пользовательский интерфейс настройки панели аудита.
• Режимы покрытия кода для каждой функции или для каждого блока
• Теперь анализ покрытия кода должен запускаться при перезагрузке страницы.

Хром 79

• Выясните причину блокировки cookie.
• Просмотреть значения файлов cookie
• Имитация различных предпочтений в отношении цветовой схемы и уменьшения интенсивности движения.
• Обновления покрытия кода
• Выясните причину запроса сетевого ресурса.
• Панели «Консоль» и «Источники» снова учитывают настройки отступов.
• Новые сочетания клавиш для навигации курсором

Хром 78

• Поддержка нескольких клиентов в панели аудита.
• Отладка обработчика платежей
• Lighthouse 5.2 в панели «Аудиты»
• Самый большой и информативный элемент оформления в панели «Производительность».
• Сообщайте о проблемах в инструментах разработчика из главного меню.

Хром 77

• Скопировать стили элемента
• Визуализация изменений компоновки
• Lighthouse 5.1 в панели «Аудиты»
• синхронизация тем ОС
• Сочетание клавиш для открытия редактора точек останова
• Предварительная загрузка кэша в панели «Сеть»
• Частная собственность при осмотре объектов
• Уведомления и push-уведомления в панели приложения.

Хром 76

• Автозаполнение с использованием значений CSS
• Новый пользовательский интерфейс для сетевых настроек.
• Сообщения WebSocket в экспорте HAR
• Кнопки импорта и экспорта HAR
• Использование памяти в реальном времени
• номера портов регистрации работников сферы услуг
• Просмотрите события фоновой выборки и фоновой синхронизации.
• Puppeteer для Firefox

Хром 75

• Полезные предустановки при автозаполнении функций CSS
• Очистка данных сайта через меню команд.
• Просмотреть все базы данных IndexedDB
• При наведении курсора мыши отображается несжатый размер ресурса.
• Встроенные точки останова в панели «Точки останова»
• Количество ресурсов IndexedDB и Cache
• Настройка для отключения подробной всплывающей подсказки «Проверить».
• Настройка для переключения отступов табуляции в редакторе

Хром 74

• Выделите все узлы, затронутые свойством CSS.
• Lighthouse v4 в панели «Аудиты»
• средство просмотра двоичных сообщений WebSocket
• Снимок области захвата экрана в меню команд.
• Фильтры Service Worker на панели «Сеть».
• Обновления панели производительности
• Длительные задания в записи панельных дискуссий о производительности
• Первая покраска в разделе «Время»
• Дополнительный совет: Быстрый способ просмотра цветовых кодов RGB и HSL (видео)

Хром 73

• Точки логарифма
• Подробные всплывающие подсказки в режиме просмотра.
• Экспорт данных о покрытии кода
• Управляйте консолью с помощью клавиатуры.
• Линия коэффициента контрастности AAA в палитре цветов
• Сохранение пользовательских настроек геолокации
• сворачивание кода
• Вкладка «Фреймы» переименована во вкладку «Сообщения».
• Дополнительный совет: Фильтрация по объектам недвижимости в сетевой панели (видео)

Хром 72

• Визуализируйте показатели производительности на панели «Производительность».
• Выделение текстовых узлов в DOM-дереве
• Скопируйте путь к файлу JavaScript в узел DOM.
• Обновления панели аудита , включая новый аудит, который обнаруживает библиотеки JavaScript, и новые ключевые слова для доступа к панели аудита из командного меню.
• Дополнительный совет: используйте режим устройства для проверки медиазапросов (видео).

Хром 71

• Наведите курсор на результат выполнения выражения в реальном времени , чтобы выделить узел DOM.
• Сохраняйте узлы DOM в качестве глобальных переменных.
• Информация об инициаторе и приоритете теперь доступна в импорте и экспорте HAR.
• Доступ к меню команд осуществляется из главного меню.
• Точки переключения «Картинка в картинке»
• Дополнительный совет: используйте monitorEvents() для записи событий, срабатывающих на узле, в консоль (видео).

Хром 70

• Выражения в реальном времени в консоли
• Выделение узлов DOM во время предварительной оценки
• Оптимизация производительности панели
• Более надежная отладка
• Включите ограничение скорости сети через командное меню.
• Условные точки останова автозаполнения
• Прерывание обработки событий AudioContext
• Отладка приложений Node.js с помощью ndb
• Дополнительный совет: измеряйте реальное взаимодействие пользователей с помощью API User Timing.

Хром 68

• Нетерпеливая оценка
• Подсказки для аргументации
• Автозавершение функций
• ключевые слова ES2017
• Lighthouse 3.0 в панели «Аудиты»
• Поддержка BigInt
• Добавление путей к свойствам в панель «Отслеживание».
• Функция «Показывать временные метки» перемещена в «Настройки».
• Дополнительный совет: Малоизвестные методы работы с консолью (видео)

Хром 67

• Поиск по всем заголовкам сети
• Предварительный просмотр значений переменных CSS
• Скопировать как получить
• Новые функции аудита, параметры конфигурации рабочего стола и просмотр трассировок.
• Остановить бесконечные циклы
• Время, затраченное пользователем, отображается на вкладке «Производительность».
• Экземпляры виртуальных машин JavaScript четко отображаются на панели «Память».
• Вкладка «Сеть» переименована во вкладку «Страница».
• Обновления темной темы
• Информация о прозрачности сертификатов в панели «Безопасность».
• Функции изоляции сайта на панели «Производительность»
• Дополнительный совет: Панель слоев + Инспектор анимации (видео)

Хром 66

• «Черный ящик» в панели «Сеть»
• Автоматическая настройка масштабирования в режиме устройства.
• Красивое форматирование текста на вкладках «Предварительный просмотр» и «Ответ».
• Предварительный просмотр HTML-контента на вкладке «Предварительный просмотр».
• Поддержка локальных переопределений стилей внутри HTML.
• Дополнительный совет: скрипты фреймворка Blackbox для повышения эффективности точек останова в обработчиках событий.

Хром 65

• Локальные переопределения
• Новые инструменты обеспечения доступности
• Вкладка «Изменения»
• Новые SEO-аудиты и аудиты производительности.
• Несколько записей на панели «Производительность».
• Надежное пошаговое выполнение кода с помощью воркеров в асинхронном коде
• Дополнительный совет: Автоматизируйте действия в инструментах разработчика с помощью Puppeteer (видео)

Chrome 64

• Монитор производительности
• Боковая панель консоли
• Сгруппировать похожие сообщения в консоли
• Дополнительный совет: используйте псевдокласс при наведении курсора (видео)

Хром 63

• Поддержка удаленной отладки для нескольких клиентов
• Рабочие пространства 2.0
• 4 новых аудита
• Имитация push-уведомлений с использованием пользовательских данных
• Запускайте фоновые события синхронизации с помощью пользовательских тегов.
• Дополнительный совет: Точки останова обработчика событий (видео)

Хром 62

• В консоли вас ждут первоклассные возможности.
• Новые рабочие процессы создания скриншотов
• Подсветка CSS Grid
• Новый консольный API для запроса объектов.
• Новые фильтры консоли
• Импорт HAR в панели «Сеть»
• Предварительный просмотр ресурсов кэша
• Более предсказуемая отладка кэша
• Покрытие кода на уровне блоков

Хром 61

• имитация регулирования скорости мобильного устройства
• Просмотр использования хранилища
• Просмотр времени кэширования ответов сервис-воркером.
• Включите индикатор FPS в командном меню.
• Настройте поведение колесика мыши на масштабирование или прокрутку.
• Поддержка отладки модулей ES6

Хром 60

• Новая аудиторская комиссия
• Значки сторонних производителей
• Новый жест для функции «Продолжить»
• Переходите на асинхронный режим.
• Более информативный предварительный просмотр объектов в консоли.
• Более информативный выбор контекста в консоли
• Обновления в режиме реального времени на вкладке «Покрытие».
• Более простые варианты регулирования скорости сети
• Асинхронные стеки включены по умолчанию

Хром 59

• Анализ покрытия кода CSS и JS
• Скриншоты на всю страницу
• Блокировка запросов
• Перейдите через asyncwait
• Единое командное меню