Search code examples
regexhtmlmodernizrbrowser-feature-detection

Is it possible to check what feature detections my codebase are using from Modernizr?


I recently inherited a huge codebase where the entire Modernizr plugin is included. I'm trying to find out what feature detections that's actually used in the code base so that I can remove all unused feature detections or possibly remove everything but the html5 shivs.

Is there a good way of figuring this out or is a huge regex search for all modernizr classes (as well as the no- prefix) and javascript methods the only option?


Solution

  • I decided to go with the regex route so here's the regex I used when searching through the codebase:

    (\.(no\-)?flexbox|\.(no\-)?flexbox-legacy|\.(no\-)?canvas|\.(no\-)?canvastext|\.(no\-)?webgl|\.(no\-)?touch|\.(no\-)?geolocation|\.(no\-)?postmessage|\.(no\-)?websqldatabase|\.(no\-)?indexeddb|\.(no\-)?hashchange|\.(no\-)?history|\.(no\-)?draganddrop|\.(no\-)?websockets|\.(no\-)?rgba|\.(no\-)?hsla|\.(no\-)?multiplebgs|\.(no\-)?backgroundsize|\.(no\-)?borderimage|\.(no\-)?borderradius|\.(no\-)?boxshadow|\.(no\-)?textshadow|\.(no\-)?opacity|\.(no\-)?cssanimations|\.(no\-)?csscolumns|\.(no\-)?cssgradients|\.(no\-)?cssreflections|\.(no\-)?csstransforms|\.(no\-)?csstransforms3d|\.(no\-)?csstransitions|\.(no\-)?fontface|\.(no\-)?generatedcontent|\.(no\-)?video|\.(no\-)?audio|\.(no\-)?localstorage|\.(no\-)?sessionstorage|\.(no\-)?webworkers|\.(no\-)?applicationcache|\.(no\-)?svg|\.(no\-)?inlinesvg|\.(no\-)?smil|\.(no\-)?svgclippaths)
    

    I think it matches all possible css hooks for modernizr. To find the Javascript usages just search for "Modernizr."