More communication with JetPack – Main to Tab via tab.attach

In a previous post I talked about Jetpack communication across a Panel, PageMod and Main.js… this example is a bit simpler and focuses on main.js communicating with a Tab’s attached contentScript.

In this example, we want:

  • User opens a new tab (or jumps to an existing one)
  • We place a button into the DOM of the page loaded in the tab
  • The button is clicked and sends a message back to main.js
  • main.js does some processing and then needs to post back to the DOM of the page in the tab.

For this barebones example, we only need two files: main.js and tab.js. Please follow the comments in the code for the explanation.

in the main.js file:

in the tab.js file:

The working add-on can be found here:

Some notes:

  • May need to wait for the DOM to be loaded before adding the button
  • Not sure if the way I have the content script attaching to the tab will load multiple copies of tab.js into the tab…