Улучшение отладчика и расширение WebExtensions API: что нового для разработчиков в Firefox 58

Недавно вышедший Firefox 57 Quantum стал быстрее, но разработчикам важна не только скорость браузера. Новые движки помогли улучшить инструменты веб-разработчика, и эти изменения уже доступны в бета-версии Firefox 58.

Средства управления CSS

Успешный запуск CSS Grid Inspector вдохновил разработчиков на создание инструмента CSS Shapes Highlighter для элементов со свойством clip-path.

Наряду с этим добавлена поддержка CSS-свойства font-display, которое позволяет фиксировать время, отведенное браузеру на ожидание загрузки шрифта.

В Firefox Quantum также появился новый CSS-движок, который исправил многочисленные баги и неточности отображения стилей. Например, calc() теперь всегда работает корректно.

Улучшенный отладчик

Инструменты Firefox постепенно переводят на современные веб-технологии. В версии Firefox 58 для разработчиков консоль, отладчик, средство мониторинга сети и режим «отзывчивого дизайна» реализованы поверх популярных библиотек вроде React и Redux. Наиболее заметные изменения коснулись отладчика.

Во-первых, теперь карты кода работают везде и поддерживают подсветку синтаксиса разметок вроде JSX:

Шаблон JSX

Во-вторых, отладчик научился распознавать Webpack и соответствующим образом отмечать его в дереве файлов. Более того, теперь он узнает более двадцати JS-библиотек и может группировать их стековые фреймы в стеке вызовов. Это нововведение упрощает отделение собственного кода разработчика от кода фреймворка во время отслеживания ошибок:

Отслеживание ошибок: раньше и сейчас

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

 

Дополнения к WebExtension API

В Firefox 58 появилось много новых WebExtension API. Одним из интересных дополнений является поддержка цветовых схем вкладок:

Разработчики обещают, что в 2018 году список доступных API будет серьёзно расширен.

Другие интересности

Firefox 58 будет полностью поддерживать WebVR и на Windows, и на macOS:

Кроме того, в Android-версии появилась поддержка аудиоформата FLAC, ранее доступного только на десктоп-платформах (Windows, macOS и Linux).

Полный список изменений доступен в документации MDN.

Источник: блог Mozilla Hacks