Проверка неопределенной переменной CSS
CSS Undefined Variable Checker - это расширение для Devtools в Google Chrome, которое помогает обнаруживать использование неопределенных CSS-переменных. Если вы пишете CSS с использованием пользовательских свойств/переменных, то это идеальный инструмент для вас. Оно добавляет вкладку в Chrome Developer Tools, позволяя вам проверять текущую страницу на наличие неопределенных CSS-переменных, используемых в выражениях "var()".
Это расширение анализирует как таблицы стилей, так и атрибуты встроенного стиля, отображая результаты в удобной таблице с ссылками на проблемные элементы во вкладке "Elements" Developer Tools. Чтобы использовать расширение, просто откройте веб-сайт в Google Chrome, откройте Developer Tools и перейдите на вкладку "CSS Undefined Variable Checker". Нажатие кнопки "Check for Undefined Variables" запустит анализ и заполнит таблицу найденными неопределенными CSS-переменными.
Таблица результатов содержит имя неопределенной переменной, таблицу стилей или встроенный стиль, где она была найдена, и элемент на странице, где она была использована. При нажатии на ссылки в таблице будет выделен проблемный элемент во вкладке "Elements" Developer Tools, что упрощает отслеживание неопределенной переменной.
Обратите внимание, что это расширение зависит от API для доступа к информации о таблицах стилей, которые ограничены Cross-Origin Resource Sharing. Таблицы стилей с разных источников без необходимых заголовков доступа не будут проанализированы. Однако это не влияет на возможность расширения анализировать другие доступные через API стили.
Для тех, кто заинтересован, логика анализа, лежащая в основе этого расширения, также доступна в виде пакета npm под названием