Browser Interface

Important: this package is in early development. It is not ready for production! Do not use it.

WebExtensions allows people to develop browser extensions for multiple browsers. Unfortunately, the methods and syntaxes are not exactly the same in every browser, so that requires some tweaking. This package aims to solve this problem by providing a single syntax for all browsers. It uses the methods and syntax described on the MDN website, and it is compatible with Google Chrome and Mozilla Firefox. Not tested yet in Microsoft Edge.

Installation

Using npm:

npm install --save browser-interface

In Node.js:

import BrowserInterface from "browser-interface";

// Create a driver and pass it the window Object
const driver = new BrowserInterface(window);

// Use it in all browsers
driver.webRequest.onBeforeRequest.addListener(
  req => {
    console.log(req);
  },
  { urls: ["<all_urls>"] }
);

API coverage

This project is still in progress. Here are the different WebExtensions APIs supported at this time.

webRequest

| Property | Status | Chrome | Firefox | Edge | | -------------------------------------------------------------------------------------------------------------------------- | -------- | ------------------ | ------------------ | --------------- | | onBeforeRedirect | Complete | :grey_question: | :grey_question: | :grey_question: | | onBeforeRequest | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onBeforeSendHeaders | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onCompleted | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onErrorOccurred | Complete | :grey_question: | :grey_question: | :grey_question: | | onHeadersReceived | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onResponseStarted | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onSendHeaders | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: |

tabs

| Property | Status | Chrome | Firefox | Edge | | -------------------------------------------------------------------------------------------------------- | -------- | ------------------ | ------------------ | ------------------------ | | onActivated | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onAttached | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onCreated | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onDetached | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onHighlighted | Complete | :heavy_check_mark: | :heavy_check_mark: | :heavy_multiplication_x: | | onMoved | Complete | :heavy_check_mark: | :heavy_check_mark: | :heavy_multiplication_x: | | onRemoved | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | onUpdated | Complete | :heavy_check_mark: | :heavy_check_mark: | :grey_question: | | sendMessage | Complete | :grey_question: | :grey_question: | :grey_question: | | query | Complete | :heavy_check_mark: | :grey_question: | :grey_question: | | create | Complete | :grey_question: | :grey_question: | :grey_question: | | remove | Complete | :grey_question: | :grey_question: | :grey_question: | | update | Complete | :grey_question: | :grey_question: | :grey_question: | | get | Complete | :grey_question: | :grey_question: | :grey_question: | | getCurrent | Complete | :grey_question: | :grey_question: | :grey_question: |

storage

| Property | Status | Chrome | Firefox | Edge | | ------------------------------------------------------------------------------------ | -------- | ------------------ | --------------- | --------------- | | sync | Complete | :heavy_check_mark: | :grey_question: | :grey_question: | | local | Complete | :heavy_check_mark: | :grey_question: | :grey_question: |

browserAction

| Property | Status | Chrome | Firefox | Edge | | ------------------------------------------------------------------------------------------------------- | -------- | ------------------ | --------------- | --------------- | | enable | Complete | :grey_question: | :grey_question: | :grey_question: | | disable | Complete | :grey_question: | :grey_question: | :grey_question: | | setIcon | Complete | :heavy_check_mark: | :grey_question: | :grey_question: | | setPopup | Complete | :grey_question: | :grey_question: | :grey_question: | | setTitle | Complete | :grey_question: | :grey_question: | :grey_question: |

runtime

| Property | Status | Chrome | Firefox | Edge | | ------------------------------------------------------------------------------------------------------------ | -------- | ------------------ | --------------- | --------------- | | getBackgroundPage | Complete | :heavy_check_mark: | :grey_question: | :grey_question: | | onMessage | Complete | :heavy_check_mark: | :grey_question: | :grey_question: | | sendMessage | Complete | :heavy_check_mark: | :grey_question: | :grey_question: |