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

SerKo

Last update: Apr 17, 2022

Overview

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

A simple Todo App with check complete function and filter todo. Made with React and TypeScript.

A simple Todo App with check complete function and filter todo. Made with React and TypeScript. The app can Add, Delete and Edit todo. Todo can be sorted by Complete or Active.

Dec 6, 2022

Kalman Filter in Javascript

Kalman Kalman filter for Javascript. Dependencies The module requires a sylvester.js (https://github.com/jcoglan/sylvester) compatible matrix and vect

Dec 19, 2022

Filter sale 1K gần bạn

Filter sale 1K gần bạn Tại sao lại có cái này? Đôi khi bạn sẽ nhận được (hoặc săn được) voucher freeship đơn 0đ của shopee (10k hoặc 25k), và phí ship

Nov 25, 2022

Search/Filter beer for beerpong

Beer for Beerpong 🍺 You can search beer to play beer pong 🍻 🏓 You sink it, they drink it LINK Technologies 🚀 React React Router Dom Beer Animation

Feb 24, 2022

A javascript plugin to filter elements from a "masonry" grid.

Isolde Isolde is a lightweight, flexible, and responsive javascript plugin allow you to filter elements from a "masonry" grid. Quick start Install Thi

Oct 13, 2022

The to-do list project is an app that allows users to successfully organize their day by inputting prioritized tasks. The project also allows users to carry out the CRUD operations for (add, edit and delete). Two special features of the app are that it saves tasks in the local storage of the user's browser, so when the user reloads or revisits the app, the user can view a list of tasks formerly inputted, and it allows users to prioritize their tasks by dragging up and down the list section.

TO-DO-LIST This is a To Do List Project that dynamically displays tasks to be done with interactions for removing and adding task when completed or no

Nov 1, 2021

This is a simple web application of a To-do List in which you can add, remove and edit all your tasks and also you can mark each task as completed and delete all completed ones.

To-Do List A simple web application of a to do list Built With HTML, CSS, JS, ES6 & Webpack Getting Started In this repository I created To-Do List SP

Apr 11, 2022

This "To-do-list" app is a simple web application that displays a list of task and allows you to add and remove task from that list. it is built with the latest technology namely; JavaScript with webpack Configuration.

To-do-list "To-do-list" is a simple web application that displays a list of task and allows you to add and remove task from that list. Built With HTML

Nov 21, 2022

This "To-do-list" app is a simple web application that displays a list of task and allows you to add and remove task from that list

This "To-do-list" app is a simple web application that displays a list of task and allows you to add and remove task from that list. it is built with the latest technology including but not limited to HTML, CSS, JavaScript and webpack to manipulate DOM.

Feb 19, 2022

v0.0.5(Apr 19, 2022)
New features

List all alternative CSS properties (-webkit, -moz, etc.)

Source code(tar.gz)
Source code(zip)
v0.0.3(Apr 16, 2022)

First public beta release
Source code(tar.gz)
Source code(zip)

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

Related tags

Overview

mdn-compat-browserlist

Features

Install

Setup

Usage

Unsupport listing

Results

Normal result sample

Nested result sample

Alternative CSS properties

Results

License

You might also like...

A simple Todo App with check complete function and filter todo. Made with React and TypeScript.

Kalman Filter in Javascript

Filter sale 1K gần bạn

Search/Filter beer for beerpong

A javascript plugin to filter elements from a "masonry" grid.

This is a simple web application of a To-do List in which you can add, remove and edit all your tasks and also you can mark each task as completed and delete all completed ones.

This "To-do-list" app is a simple web application that displays a list of task and allows you to add and remove task from that list. it is built with the latest technology namely; JavaScript with webpack Configuration.

This "To-do-list" app is a simple web application that displays a list of task and allows you to add and remove task from that list

Releases(v0.0.5)

v0.0.5(Apr 19, 2022)

New features

v0.0.3(Apr 16, 2022)

Owner

SerKo

Obsidian-dataview-table-filter-menu - Dynamically created filter menu for dataview tables in obsidian

Query for CSS brower support data, combined from caniuse and MDN, including version support started and global support percentages.

💻 Countries Web is a web application that lets you view data for all the countries in the world and filter them by country name and continent.

Easy view and filter all follows and following. Auto update by GitHub Action.

This package generates a unique ID/String for different browsers. Like chrome, Firefox and any other browsers which supports canvas and audio Fingerprinting.

Javascript client for Sanity. Works in node.js and modern browsers (older browsers needs a Promise polyfill).

jQuery filter for all purposes.

jQuery easy ticker is a news ticker like plugin, which scrolls the list infinitely. It is highly customizable, flexible with lot of features and works in all browsers.

History.js gracefully supports the HTML5 History/State APIs (pushState, replaceState, onPopState) in all browsers. Including continued support for data, titles, replaceState

A to-do list set up using webpack. It allows the user to add, remove, edit and check items on the list. All the data is saved in local storage.