Новая Версия Инструментов Разработчика

В бета-канале появилась новая версия инструментов разработчика с очень приятными изменениями.

Появилась информация о фазах каждого запроса: сколько времени ушло на прокси, DNS, ожидание, отправку и получение данных.
Заголовки HTTP теперь берутся непосредственно из тела ответа, прежде чем они будут интерпретированы веб-китом, поэтому вы можете точно видеть, что отправил сервер.
Добавлена подсветка синтаксиса в теле ответа.

Имя и значение поля теперь можно редактировать отдельно, как в Firebug. Есть автодополнение ключевых слов
Отображаются все свойства CSS, даже те, которые предназначены для других браузеров или содержат ошибки.
Вы можете выбрать, в каком формате отображать цвета: в том виде, в котором они указаны в стилях, Hex, RGB или HSL.

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

Во вкладке Ресурсы можно редактировать JS-файлы (почему-то не работает для HTML и CSS)
Вы можете скопировать переменную из консоли в буфер обмена, используя copy(varName)
Вы можете перейти к нужному элементу DOM, вызвав Inspect(elementReference) в консоли.
Переменная $0 в консоли всегда содержит текущий элемент, выбранный на вкладке «Элементы».

Оригинальные новости на английском языке Теги: #chrome #webinspector #Google Chrome

Вместе с данным постом часто просматривают: