How to embed script content on page load when there is a popup page?

Question

I need my code to be entered using the content script method for google chrome extensions. This only works when my manifest doesn't have a popup page and my background.html has the following:

chrome.browserAction.onClicked.addListener(function(tab) { chrome.tabs.executeScript(null, { file: "jquery.js" }, function() { chrome.tabs.executeScript(null, { file: "content_script.js" }); }); }); 

How can I run this code every time a new page has been loaded in chrome with a PoPup page? because for now, the only way it works is when I click the extension browser action button.

Also in my manifest script section, I included all of this:

 "content_scripts": [ { "matches": ["http://jquery.com/*"], "all_frames":true, "js": ["jquery.js","jquery-ui.min.js","content_script.js"], "run_at": "document_end" } ], 

Answer 1

Short answer: Use chrome.tabs.onUpdated.addListener instead of chrome.browserAction.onClicked.addListener from the help page to load the contents of the script each time the page is refreshed.

Long answer: You CAN actually load the script content when they are pop-up, either by including the contents of the script from the manifest or using a software injection from the help page (as you said in your question).

From the manifest:

 { "name": "My extension", ... "content_scripts": [ { "matches": ["http://myurl.com/*"], "css": ["mystyles.css"], "js": ["jquery.js", "myscript.js"] } ], "permissions": [ "http://myurl.com/*", "tabs" ], "background_page": "background.html", "browser_action": { "popup": "popup.html" } ... } 

Make sure the matches property matches the URL of the page where you want to load the script content.

Using a software injection:

You can use the method that you suggested in your question, which will insert the contents of the script when you click on the browser action OR , you can do this every time the browser URL is updated as follows:

 chrome.tabs.onUpdated.addListener(function() { chrome.tabs.executeScript(null, { file: "jquery.js" }, function() { chrome.tabs.executeScript(null, { file: "content_script.js" }); }); });