A tool for analyzing frontend code to find browser compatibility issues powered by MDN compatibility data
Scans HTML, CSS & JS files for compatibility issues
Reports both deprecated & mixed-support features
Supports configuration of target browsers (including browserslist)
VSCode Extension
Extension Settings
browser-compatibility-checker.enableOnChange: Enable this extension on start and file change
browser-compatibility-checker.useError: Use a severity of 'Error' for each problem (otherwise uses 'Warning')
browser-compatibility-checker.browserList: Which browsers to check compatibility for (defaults to all MDN recognised browsers)
browser-compatibility-checker.warnForOtherBrowsers: Show a warning for issues with browsers not in the browser list
browser-compatibility-checker.foldersToIgnore: Glob paths to exclude from scanning
CLI Tool
npm i -g browser-compatibility-checker
npx browser-compatibility-checker
Arguments
-f, --folder: Folder path to scan
-b, --browsers: Comma seperated list of browsers to check (defaults to all)
-i, --ignore: Comma seperated list of glob paths to ignore
Local development
Installation
npm install
npm run watch
Run:
VSCode extension: Open VSCode & press F5 to run the extension
CLI tool: npm i -g, then run with browser-compatibility-checker
Disclaimer
This tool is not a replacement for cross-browser testing and cannot verify how elements will perform on various browsers.
Elements which are not flagged as incompatible may still have issues on some browsers.
