Last active
October 28, 2016 13:57
-
-
Save Perlkonig/06391567d34552cc0238d25e6ca2501b to your computer and use it in GitHub Desktop.
This is a method for scanning an open page for class declarations that don't exist in any loaded CSS. This only works for CSS files that are hosted on the same domain as the open page! I tested this code in Chrome. Just load the page you're interested in, open the console, paste in the code, then type `scan()`.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function classExists(className, root = null) { | |
var pattern = new RegExp('\\.' + className + '\\b'), found = false | |
var sheets = root; | |
if (root === null) { | |
sheets = document.styleSheets; | |
} | |
try { | |
for (var i=0; i<sheets.length; i++) { | |
var ss = sheets[i]; | |
// decompose only screen stylesheets | |
if (!ss.media.length || /\b(all|screen)\b/.test(ss.media.mediaText)) { | |
if (ss.cssRules !== null) { | |
for (var j=0; j<ss.cssRules.length; j++) { | |
var r = ss.cssRules[j]; | |
// ignore rules other than style rules | |
if (r.type === CSSRule.STYLE_RULE) { | |
if (r.selectorText.match(pattern)) { | |
found = true; | |
throw "found"; | |
} | |
} else if (r.type === CSSRule.MEDIA_RULE) { | |
if (classExists(className, [r])) { | |
found = true; | |
throw "found"; | |
} | |
} else { | |
console.log("Unhandled CSSRule type: " + r.type); | |
} | |
} | |
} | |
} else { | |
console.log('Skipping the following sheet because of media type:'); | |
console.log(ss); | |
} | |
} | |
} catch(e) {} | |
return found | |
} | |
function scan() { | |
var allClasses = []; | |
var toScan = document.querySelectorAll('[class]'); | |
for (var i=0; i<toScan.length; i++) { | |
var classes = toScan[i].className.split(/\s+/); | |
for (var j=0; j<classes.length; j++) { | |
var cls = classes[j]; | |
if (cls && allClasses.indexOf(cls) === -1) { | |
allClasses.push(cls); | |
} | |
} | |
} | |
// console.log(allClasses); | |
console.log("CSS rules could not be found for the following class names:"); | |
allClasses.forEach(function (name) { | |
if (! classExists(name)) { | |
console.log("\t" + name); | |
} | |
}); | |
console.log("Done."); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment