Package Exports

mdn-compat-browserlist
mdn-compat-browserlist/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (mdn-compat-browserlist) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

mdn-compat-browserlist

List all browsers compat data from MDN and filter with browserlist.

Features

Support filter all browserlist queries
List all browser unsupported features (including HTML, CSS, JavaScript, SVG, Web API, WebExtensions, etc.)
List all alternative CSS properties (-webkit, -moz, etc.)
List all browser supported features

Install

npm install mdn-compat-browserlist

yarn add mdn-compat-browserlist

Setup

import { MdnCompat } from "mdn-compat-browserlist";
import bcd from "@mdn/browser-compat-data";

Usage

Init MdnCompat with browserlist query and config (optional).

const compat = new MdnCompat(["> 0.5%", "last 2 versions", "not dead"]);

Unsupport listing

compat.unsupport(bcd.css);
compat.unsupport(bcd.css.properties);
compat.unsupport(bcd.css.properties["justify-content"]);

Results

For listing unsupported features, the browser list in __browsers will contains the max version of the browser which filter by browserlist query.

Normal result sample

must contains __browsers key

'box-shadow': {
  __browsers: {
    chrome: '100',
    chrome_android: '100',
    firefox: '99',
    firefox_android: '99',
    opera_android: '64',
    safari: '15.4',
    safari_ios: '15.4',
    samsunginternet_android: '16.0',
    webview_android: '100'
  }
}

Nested result sample

must NOT contains __browsers key

'justify-content': {
  flex_context: {
    __browsers: { firefox: '99', firefox_android: '99' }
  },
  grid_context: {
    __browsers: { ie: '11' }
  }
}

Alternative CSS properties

compat.alternative(bcd.css.properties);
compat.alternative(bcd.css.properties["justify-content"]);

Results

compat.alternative(bcd.css.properties["font-smooth"]);

// output
["-webkit-font-smoothing", "-moz-osx-font-smoothing"];

compat.alternative(bcd.css.properties["justify-content"]);

// output
{
  flex_context: ["-webkit-justify-content"],
  grid_context: []
}

License

MIT License

CC0-1.0 License for MDN data