Running javascript on pinned tabs in firefox

Question

I want to run some javascript on pages opened in pinned tabs in firefox, specifically I want to modify the dom of web pages which are loaded in pinned tabs. How do I do that with firefox addon api?

Answer 1

You can do it with Firefox tabs API. Any Tab has a "pinned" property that can be read from the background page.

For example, you may do it in this way:

Make isTabPinned request bridge in your background script, which will get the tab property and send it to the content script.

bg.js

chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
    if (msg.request == "isTabPinned") {
        sendResponse(sender.tab.pinned);
    }
});

In content-script send the request to the background script bridge to get the tab pin status and modify the DOM if the tab is pinned.

cs.js

chrome.runtime.sendMessage({ request: "isTabPinned" }, tabPinned => {
    if(tabPinned){
        //.. modify your DOM here
    }
});

Load the content script to pages you need to check (or to any pages as it in the example) and background script. Give the "tabs" and "activeTab" permissions to your script.

manifest.json

{
    "manifest_version": 2,
    "name": "Pin Detector",
    "version": "0.1",

    "background": {
      "scripts": ["bg.js"]
    },

    "content_scripts": [
      {
        "matches": ["*://*/*"],
        "js": ["cs.js"]
      }
    ],

    "permissions": ["tabs","activeTab"]
}