insertCSS doesn't do anything

Question

I am making an extension, and I want it to insert custom CSS into a website. I am using insertCSS() to do so, but nothing happens. I checked out this extension that uses the same function, and it works there. I want my extension to load the CSS immediatly, and not after a click. code below:

manifest.json

{

    "manifest_version": 2,
    "name": "Vulcan.js",
    "version": "1.0",
  
    "icons": {
      "16": "logo/logo16.png",
      "32": "logo/logo32.png",
      "48": "logo/logo48.png",
      "64": "logo/logo64.png",
      "128": "logo/logo128.png"
    },


    "browser_action": {
        "default_icon": "logo/icon.png",
        "default_title": "Vulcan.js",
        "default_popup": "popup.html"
    },

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

    "content_scripts": [
      {
        "matches": ["*://*.vulcan.net.pl/*"],
        "js": ["themes/folly/vulcan.js"]
      }
    ]
  
  }

themes/folly/vulcan.js

/* send a message to the console so we know that the code is working */
console.log("Vulcan.js loaded!");

/* change document title and favicon */
/* use favicon from the web as js won't allow me to href a local file */
document.title = "Vulcan.js";
document.querySelector("link[rel='shortcut icon']").href = "https://raw.githubusercontent.com/NatanGrygiel/vulcan.js/master/logo/icon.png";

/* define our custom CSS */
const CSS = "body { border: 20px solid red; }";
/* use insertCSS() to insert the CSS into the page */
browser.tabs.insertCSS({code: CSS});

I've spent all day searching for anything, but i have no idea on why this doesn't work. Any help would be appreciated.

insertCSS doesn't do anything

0 Answers