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

Кейси Баск
Kayce Basques

Поддержка Moto G4 в режиме устройства

После включения панели инструментов устройства вы можете имитировать размеры области просмотра Moto G4 из списка устройств .

Имитация окна просмотра Moto G4

Нажмите кнопку «Показать рамку устройства» , чтобы отобразить аппаратное обеспечение Moto G4 вокруг области просмотра.

Демонстрация аппаратной части Moto G4.

Дополнительные функции:

  • Откройте командное меню и выполните команду Capture screenshot , чтобы получить снимок экрана области просмотра, в которой отображается оборудование Moto G4 (после включения параметра «Показать рамку устройства» ).
  • Для более точного моделирования условий просмотра веб-страниц мобильным пользователем следует ограничить скорость сети и процессора .

Проблема Chromium № 924693

Обновления, касающиеся файлов cookie.

Заблокированные файлы cookie в панели «Cookies»

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

Заблокированные файлы cookie в разделе «Cookies» панели приложения.

См. также раздел «Отладка причин блокировки cookie» , чтобы узнать, как получить доступ к аналогичному пользовательскому интерфейсу из панели «Сеть».

Выпуск Chromium № 1030258

Приоритет файлов cookie в панели «Cookie»

В таблицах Cookie на панелях «Сеть» и «Приложения» теперь есть столбец «Приоритет» .

Выпуск Chromium № 1026879

Изменить все значения cookie

Теперь все ячейки в таблицах Cookie доступны для редактирования, за исключением ячеек в столбце Size , поскольку этот столбец представляет собой сетевой размер cookie в байтах. См. раздел Fields для пояснения каждого столбца.

Редактирование значения cookie

Скопируйте как Node.js fetch, чтобы включить данные cookie.

Щелкните правой кнопкой мыши сетевой запрос и выберите «Копировать» > «Копировать как запрос Node.js», чтобы получить выражение fetch , включающее данные cookie.

Скопировать как Node.js fetch

Выпуск Chromium № 1029826

Более точные значки манифеста веб-приложения

Ранее панель «Манифест» в панели «Приложение» выполняла собственные запросы для отображения значков манифеста веб-приложения. Теперь в инструментах разработчика отображается точно такой же значок манифеста, который использует Chrome.

Значки в панели «Манифест»

Выпуск Chromium № 985402

Наведите курсор на свойства content CSS, чтобы увидеть значения без экранирования.

Наведите курсор на значение свойства content , чтобы увидеть его неэкранированную версию.

Например, в этом примере при проверке псевдоэлемента p::after в панели «Стили» вы увидите экранированную строку:

Сбежавшая струна

При наведении курсора на значение content отображается его неэкранированное значение:

Неизбежное значение

Более подробная информация об ошибках в исходном коде в консоли.

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

Ошибка загрузки карты исходного кода в консоли.

Настройка для отключения прокрутки за конец файла.

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

Вот GIF-анимация этой функции .

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

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

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

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

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

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