DEV Community

loading...

One browser extension to rule them all

blacklight profile image Fabio Manganiello ・2 min read

The current WebExtensions API has made the world of browser extensions safer and more cross-compatible, but it has also introduced its share of limitations and compromises in order to achieve better security.

Something I miss from the "first wave" of add-ons/browser apps is the possibility to customise every single aspect of the browser (UI, input events, background scripts etc.) through tweaks and custom scripts. And I've always wanted the ability to connect these tweaks/custom browser actions to my increasing (and increasingly fragmented) network of smart devices around - perform actions like turn on the lights, cast a video or action a switch directly from the browser, without grabbing the phone and opening an app, and without switching tabs in the browser. Moreover, I wanted the ability to run any kind of simple browser actions (simplify/translate page, share to Twitter/Facebook, play on Chromecast/Kodi, send link to mobile device...) as simple JavaScript snippets within the same extension - I've always considered the idea of having a separate extension, and a separate icon in the browser toolbar, just to do one specific little thing as pure madness.

So I got my plan together and finally developed an extension that could fill the gap. An extension that makes e.g. writing a browser action to cast a YouTube URL to your Chromecast something as simple as a JavaScript snippet:

async (app, args) => {
  const url = await app.getURL();
  if (!url.startsWith('https://www.youtube.com/watch?v=')) {
    return;
  }

  const response = await app.run({
    action: 'media.chromecast.play',
    args: {
      resource: url,
    },
  }, args.host);

  if (response.success) {
    app.notify('YouTube video now playing on Chromecast');
  }
}

Medium article: https://medium.com/@automationguru/one-browser-extension-to-rule-them-all-3118dc7f9c9b

Firefox link: https://addons.mozilla.org/en-US/firefox/addon/platypush/

Chrome link: https://chrome.google.com/webstore/detail/platypush/aphldjclndofhflbbdnmpejbjgomkbie?hl=en-GB&authuser=0

Discussion (0)

pic
Editor guide