I'm trying to stop all tabs from loading when chrome starts up. I then
want to load only the tab I click on.
I was able to do this by using a content script in
manifest.json.
{
"name": "blah",
"version": "1.0",
"background_page": "background.html",
"content_scripts": [
{
"matches": ["http:// */*"],
"js": ["stop.js"],
"run_at": "document_start"
}
] ,
"permissions": [
"tabs", "http://*/*"
]
}
stop.js just contains one line
window.stop();
Now this isn't ideal because, being a content script it stops loading
everytime, including when I click on a tab.
So, I tried doing in in background.html without a content script, but
I can't get it to work:
background.html
<!doctype html>
<html>
<script>
chrome.tabs.getAllInWindow(null, function stopTabs(tabs) {
for (var i in tabs) {
var tab = tabs[i];
//alert(tab.url);
var stopLoading = {'code': 'window.stop();alert("stopped");'}; //alerts work here, but window.stop doesn't?!!
chrome.tabs.executeScript(tab.id, stopLoading);
}
});
</script>
</html>
How do I do this? Loading the clicked tab seems easy, but I need to do this first.
Looks like this problem is related to this bug report, if you star it maybe it will get fixed sooner.
Related
In console I can input document.getElementById('...') and get a value back. Or even .textContent and get the string I want.
Once I pop this into my chrome extension and run it, it evaluates document.getElementById('...') as null. What's up?
Manifest.json:
{
"name": "CSUF RMP",
"version": "0.1",
"manifest_version" : 2,
"description": "Displays professor ratings on icon click",
"background" : {
"scripts" : ["background.js"]
},
"browser_action": {
"default_icon": "icon16.png"
},
"content_scripts": [
{
"matches": ["https://mycsuf.fullerton.edu/*"],
"js": ["script.js"]
}
],
"permissions": ["<all_urls>", "*://*/*", "http://*/*", "https://*/*"]
}
Background.js:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(null, {file: "script.js"});
});
My script.js is literally what I posted at the top. The script is supposed to have access to the web page's DOM (thus I need a content script) and run it on click of the icon (hence the background.js)
I can get the page to run and show an alert or something, but that line isn't evaluating the page's dom, just null.
I think I know what is the problem here,
you are executing script.js just like a normal script, and a normal script can't interact with the page DOM, you can think about it as just runing a script from a file- it don't have the content script's privileges that way.
What you can do is open a new tab (with the url of the content script), and then pass to the content script at that new tab a message which tells him to run a specific function there.
You can test it without using message sending by setting the onload of the content script to something like: onload=alert(document.getElementById('...')); and than open a new tab from the background page: chrome.tabs.create({"url":"https://mycsuf.fullerton.edu"});
tell me how it goes :)
Edit: forgot to mention that you need the 'tabs' permission in your manifest file in order to open new tabs and test the thing out.
Hello all i want to load the script whether or not user clicks on my extension icon
This is my extension it works great but i want it to work without making the user click on the icon to load the scripts ..
Here is the code .
{
"name": "Injecta",
"version": "0.0.1",
"manifest_version": 2,
"description": "Injecting stuff",
"background":
{
"scripts": ["jquery.js","background.js"]
},
"browser_action": {
"default_title": "Inject!"
},
"permissions": [
"https://*/*",
"http://*/*",
"tabs"
]
}
This is my background.js
chrome.browserAction.onClicked.addListener(function (tab) {
chrome.tabs.executeScript({
file: 'jquery.js'
});
chrome.tabs.executeScript({
file: 'inject.js'
});
});
i just want the extension to load all the scripts with the page load. currently user has to click on the icon to load the scripts..
What executeScript does is basically creating a Content Script dynamically. This is called Programmatic Injection.
An alternative method of working with content scripts is specifying them in the manifest. This achieves exactly what you're asking: content scripts are executed automatically when the page is loaded.
"content_scripts" : [
{
"js": ["jquery.js", "inject.js"],
"matches": ["*://*/*"]
}
],
Adjust the matches parameter to only include match patterns for pages you want it to run on.
Make sure to check out the documentation of run_at parameter if you need to fine-tune when injection happens.
if (typeof jQuery === 'undefined') {}
Within me Google Chrome extension I would like to inject some HTML code into website by appending a DIV to the BODY element. My current test content script for this looks as follows:
window.onload = function() {
$('body').css('background-color', 'blue'); // just for testing
$('body').append("<div>hello world</div>");
};
The background color does change to blue. However, appending the DIV seems not. At least I cannot find anything on the page or in the page source code. What am I missing here?
you don't need to add window.onload because content scripts load when the page is already loaded, see this page. remember to add permissions in manifist correctly:
"permissions": [
"activeTab",
"tabs",
"http://*/*", "https://*/*"
],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["js/contentscript.js"]
}
]
I assumed that your content script will load in all tabs and it loades the content script from js folder.
I am trying to create a chrome extension that will click a link when the page of a certain site is loaded/refresh. So far I have not been able to get it to work, I've tried different code snippets from different sources but no matter what I try it still doesnt do anything.
My manifest looks like this --
{
"name": "SITENAME",
"manifest_version": 2,
"version": "1",
"content_scripts": [
{
"matches": ["*://SITENAME.com/*"],
"js": ["sitenamelink.js"]
}
], "permissions": [
"tabs" , "*://SITENAME.com/*"
]
}
The site will have random dynamic variables appended to the end of it, such as "sitename.com/product/model...etc. etc." so theres really no way for it to be predictable, only way would to find the page url and update the extension everytime which is not something I want to have to do.
I was trying to keep the js coding clean and simple and the js I have now is --
$(document).ready(function(){
$('#addToCartLink').trigger('click');
});
I also tried this --
jQuery.noConflict();
jQuery(document).ready(function() {
jQuery('a#addToCartLink')[0].click();
});
and this --
$(document).ready(function(){
$('a#addToCartLink')[0].click();
});
The page that has the link, has it coded as such -- <a id="addToCartLink" href="javascript:addToCart()" onclick="showBubble(this)" onmouseout="hideBubble()"><span>Add to Cart</span></a>
Im not sure how to inspect it to see where my code is failing because when I inspect with chrome, it only shows the js errors from that page's coding.
So what am I doing wrong? Any help is much appreciated. Thanks.
Here's a test page, the size is selected if you follow this link, and now only requires for the add to cart link to be clicked. -- Test Page
My sample extension (see code below) worked fine for me.
E.g.: Visiting the Test Page you provided, the ADD TO CART link is clicked and the item is added to cart.
manifest.json:
{
"manifest_version": 2,
"name": "Test Extension",
"version": "0.0",
"offline_enabled": false,
"content_scripts": [{
"matches": ["*://*.sitename.com/*"],
"js": ["content.js"],
"run_at": "document_end",
"all_frames": false
}]
}
content.js:
document.getElementById('addToCartLink').click();
I'm trying to generate an extension that keeps my brother of facebook. So I decided i'll redirect all facebook links to google for starters.
This is how i went about it.
My manifest.json file :
{
"name": "FBRehab"
"version": "1.0",
"description": "Redirect FB",
"permissions": [
"tabs", "http://www.facebook.com/*", "https://www.facebook.com/*"
],
"browser_action": {
"default_icon": "icon.png",
"background_page": "background.html"
},
]
}
My background.html :
<html>
<head>
<script>
chrome.tabs.executeScript(null, { file: "jquery.js" }, function() {
chrome.tabs.executeScript(null, { file: "try.js" });
});
</script>
</head>
and try.js
<head>
<script language="JavaScript">
var time = null
function move() {
window.location = 'www.google.com'
}
</script>
</head>
Yet, it does not redirect. I've tried directly injecting the try.js using content scripts too.
Please help me.
Thanking you.
Ashar :)
Remember a Background Page runs exactly once in Chrome, it is a single long running script that runs exactly once.
Basically what your code does now is that once your browser loads, it will inject jquery and try Content Scripts to the current tab. You have no tabs that are currently loaded (which it will fail unless you have it auto load a tab). Then it will not do anything anymore because the Background Page runs exactly once!
What you need to do instead is use a Content Script which should be defined as follows:
// Only execute in the top window, we don't want to inject the iframes.
if (window == top) {
window.location = 'www.google.com'
}
In your manifest, you will have the following:
{
"name": "No more Facebook extension",
...
"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],
"js": ["redirect.js"]
}
],
...
}
I think you want to use a content script instead of a background page. You can specify that your content script should only run on specific web pages.
Do you ever call move()? Doesn't look like it to me, but I've never developed a Chrome extension before... so I'm not sure if it is ever called automatically.