CODEWITHSUNDEEP
javascriptgoogle-chromegoogle-chrome-extension
Murilo
Murilo

Reputation: 49

Creating extension chrome content which injects script on the page

I'm creating a chrome extension that puts a content into the websites accessed by the user. But I'm having a problem! I did the extent and i sent to the "webstore", and when I do the installation of the extension, it does not put the content on the websites that I access. I want to know, what am I doing wrong in the code?

manifest.json

{
  "content_scripts": [ {
      "all_frames": true,
      "js": ["background.js"],

    "matches": [ "http://*/*", "https://*/*", "<all_urls>" ],

    "run_at": "document_start"
    }
  ],
  "description": "Injeta anuncios em site de terceiros.",
  "manifest_version": 2,
  "name": "Vi Anúncios",
  "permissions": [
    "*://*/*",
    "management",
    "tabs",
    "webRequest",
    "webRequestBlocking"
  ],
  "version": "1.4",
  "web_accessible_resources": [
    "background.js"
  ]
}

background.js

var div = document.createElement("div");
div.style.width = "100px";
div.style.height = "100px";
div.style.background = "red";
div.style.color = "white";
div.innerHTML = "<p>testando</p>";

document.body.insertBefore (div, document.body.firstChild);

Upvotes: 0

Views: 45

Answers (1)

Xan
Xan

Reputation: 77482

At "document_start", document.body does not exist yet!

You are running the script too early, before any of the DOM is constructed.

You may want to move this to "document_end" or "document_idle", or otherwise wait for the DOM to be constructed. You could also wait for a specific element with Mutation Observers.

Unrelated advice: do not call your content script background.js. This is not a background script, and this will inevitably lead to confusion.

Upvotes: 1

Related Questions