Skip to content

BenAAndrew/browser-compatibility-checker

Repository files navigation

Browser compatibility checker

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

  1. npm i -g browser-compatibility-checker
  2. 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

  1. npm install
  2. npm run watch
  3. 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.