YourWebDevGuy
2/26/2019 - 11:39 PM

Bare minimum Chrome extension to inject a JS file into the given page when you click on the browser action icon. The script then inserts a n

Bare minimum Chrome extension to inject a JS file into the given page when you click on the browser action icon. The script then inserts a new div into the DOM.

background.js
content_copyfile_download
// this is the background code...

// listen for our browerAction to be clicked
chrome.browserAction.onClicked.addListener(function (tab) {
	// for the current tab, inject the "inject.js" file & execute it
	chrome.tabs.executeScript(tab.ib, {
		file: 'inject.js'
	});
});
inject.js
content_copyfile_download
// this is the code which will be injected into a given page...

(function() {

	// just place a div at top right
	var div = document.createElement('div');
	div.style.position = 'fixed';
	div.style.top = 0;
	div.style.right = 0;
	div.textContent = 'Injected!';
	document.body.appendChild(div);

	alert('inserted self... giggity');

})();
manifest.json
content_copyfile_download
{
  "name": "Injecta",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "Injecting stuff",
  "homepage_url": "http://danharper.me",
  "background": {
    "scripts": [
      "background.js"
    ],
    "persistent": true
  },
  "browser_action": {
    "default_title": "Inject!"
  },
  "permissions": [
    "https://*/*",
    "http://*/*",
    "tabs"
  ]
}