CSS Undefined Variable Checker
CSS Undefined Variable Checker är en Devtools-tillägg för Google Chrome som hjälper till att upptäcka användning av odefinierade CSS-variabler. Om du skriver CSS med anpassade egenskaper/variabler är detta verktyg perfekt för dig. Det lägger till en flik i Chrome Developer Tools som gör det möjligt att kontrollera den aktuella sidan efter eventuella odefinierade CSS-variabler som används inom "var()"-uttryck.
Denna förlängning analyserar både stilmallar och inline-stilattribut och visar resultaten i en användarvänlig tabell med länkar till de felaktiga elementen inom Developer Tools Elements-fliken. För att använda förlängningen öppnar du helt enkelt en webbplats i Google Chrome, öppnar Developer Tools och navigerar till fliken "CSS Undefined Variable Checker". Genom att klicka på knappen "Kontrollera odefinierade variabler" startar du analysen och fyller tabellen med eventuella odefinierade CSS-variabler som hittas.
Resultattabellen visar namnet på den odefinierade variabeln, stilmallen eller inline-stilen där den hittades och elementet på sidan där den användes. Genom att klicka på länkarna i tabellen markeras det problematiska elementet i Developer Tools Elements-fliken, vilket gör det enkelt att hitta den odefinierade variabeln.
Vänligen observera att denna förlängning förlitar sig på API:er för att få åtkomst till stilmallsinformation, vilket begränsas av Cross-Origin Resource Sharing. Stilmallar från olika ursprung utan nödvändiga åtkomsthuvuden kommer inte att analyseras. Detta påverkar dock inte förlängningens förmåga att analysera andra API-åtkomliga stilar.
För de som är intresserade finns analyslogiken bakom denna förlängning också tillgänglig som ett npm-paket som heter
