How to communicate between Content Script, Popup, and Background in Browser Extension development

• webextension-polyfill

  18 2,535 4.7 JavaScript

  A lightweight polyfill library for Promise-based WebExtension APIs in Chrome

  

The finished code is available in my GitHub at web-extension-communication-blog-post. I recommend you open the link and follow along with me. We will also use a polyfill so we don't have to deal with the API differences between Firefox and Chrome. Also, the polyfill allows Promise-based API for both Firefox and Chrome. I am using webextension-polyfill-ts which is a TypeScript wrapper for Mozilla's webextension-polyfill.

• webext-redux

  1 1,219 0.0 JavaScript

  A set of utilities for building Redux applications in Web Extensions.

There are other ways people are trying to solve this like webext-redux which is a clever way for message passing along with managing state between different parts of the extension the redux way. But I feel it adds additional verbose API in an attempt to solve existing complexity and only works with React. Feel free to check that repository if that suits your requirements.

• SurveyJS

  surveyjs.io sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

Suggest a related project