Browser support

Browser support

If you want to check the current browser API support for this library, follow the instructions below to generate a report like this:

╔═════════════════╤══════════════╤═══════════════╤══════════╤═════════════════╗
║ Browser         │ getUserMedia │ MediaRecorder │ WebAudio │ getDisplayMedia ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Chrome Desktop  │ ✔            │ ✔             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Android Chrome  │ ✔            │ ✔             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Firefox Desktop │ ✔            │ ✔             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Android Firefox │ ✔            │ ✖             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Edge            │ ✔            │ ✖             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ iOS Safari      │ ✔            │ ✖             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Safari Desktop  │ ✔            │ ✖             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Opera Mobile    │ ✔            │ ✖             │ ✔        │ ?               ║
╟─────────────────┼──────────────┼───────────────┼──────────┼─────────────────╢
║ Opera Desktop   │ ✔            │ ✔             │ ✔        │ ?               ║
╚═════════════════╧══════════════╧═══════════════╧══════════╧═════════════════╝

The report is generated using the latest data pulled from https://caniuse.com.

Installation

Install the dependencies with npm:

npm install caniuse-api table log-symbols

Usage

Now copy the script below into a new file, e.g. browser-support.js and run that file with node.js to generate and display the report in the console:

node browser-support.js

Script

const table = require('table');
const caniuse = require('caniuse-api');
const logSymbols = require('log-symbols');

// query caniuse for supported API's
let mediaRecorder_support = caniuse.getSupport('mediarecorder');
let getUserMedia_support = caniuse.getSupport('stream');
let webAudio_support = caniuse.getSupport('audio-api');

// table headers
let data = [['Browser', 'getUserMedia', 'MediaRecorder', 'WebAudio', 'getDisplayMedia']];

// browser mapping
let browsers = {
    'chrome': 'Chrome Desktop',
    'and_chr': 'Android Chrome',
    'firefox': 'Firefox Desktop',
    'and_ff': 'Android Firefox',
    'edge': 'Edge',
    'ios_saf': 'iOS Safari',
    'safari': 'Safari Desktop',
    'op_mob': 'Opera Mobile',
    'opera': 'Opera Desktop'
};

function checkSupport(target) {
    if (target) {
        if (target.y) {
            return logSymbols.success;
        } else if (target.n) {
            return logSymbols.error;
        }
    } else {
        return '?';
    }
}

let keys = Object.keys(browsers);
let index, browserId, browserName, mrSupport, gumSupport;
for (index=0; index < keys.length; index++) {
    browserId = keys[index];
    browserName = browsers[browserId];
    mrSupport = checkSupport(mediaRecorder_support[browserId]);
    gumSupport = checkSupport(getUserMedia_support[browserId]);
    waSupport = checkSupport(webAudio_support[browserId]);
    gdmSupport = checkSupport();

    data.push([browserName, gumSupport, mrSupport, waSupport, gdmSupport]);
};

// render table
let output = table.table(data);
console.log(output);