Here is my manifest.json, just in case for reference.
{
"manifest_version": 2,
"name": "Results app", "description": "This extension helps
calculate your total and percentage.", "version": "1.0",
"permissions": ["http://www.example.com/*"],
"page_action": {
"default_icon": {
"19": "icon.jpg"
},
"default_title": "",
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": ["http://www.example.com/*"],
"js": ["contentscript.js"]
}
]
}
How do I get pageaction icon to be displayed on the site which matches the criteria as given in manifest.json.
I tried this but no avail.
Generally, now how can I get pageaction icon to be displayed??
Debugging background page: I got this error
The best way to show the page action button (since Chromium 33) is via the chrome.declarativeContent API:
For example, to show the page action on example.com and its subdomains, the following code can be used:
chrome.runtime.onInstalled.addListener(function() {
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [
new chrome.declarativeContent.PageStateMatcher({
pageUrl: {
hostSuffix: 'example.com'
}
})
],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
});
Do not forget to add the declarativeContent and *://*.example.com/ permissions to your manifest file.
See the documentation of the UrlFilter type for more ways of matching URLs, and chrome.declarativeContent for usage details.
Related
I wanna make Chrome extension that when for example I typing this address:
ul/g
automatic update tab URL to:
http://ultra.com/g
this is my manifest.json:
{
"manifest_version": 2,
"name": "Test ",
"description": "Test",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.htm"
},
"background": {
"scripts": [
"src/background.js"
],
"persistent": true
},
"permissions": [
"tabs",
"activeTab",
"http://*/*",
"<all_urls>"
],
"content_scripts" : [{
"matches" : [ "http://test.com/*","<all_urls>"],
"js" : ["myScript.js"]
}]
}
and in my background.js file:
chrome.tabs.onUpdated.addListener( function( tabId, changeInfo, tab) {
if(tab.url=="ul/g"){
chrome.tabs.update(tab.Id, {url: 'http://ultra.com/g'});
}
});
why this not working?
Assuming the entire question is why this not working? an answer would be because ul/g is not an URL so Chrome redirects the text to a search engine. Here's what chrome.tabs.onUpdated sees:
{title: "ul/g - Google Search"}
{status: "loading", url: "https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=ul/g&*"}
{status: "complete"}
You can intercept omnibox search requests using webRequest API. For example with google search by default you can see requests like this:
https://www.google.com/complete/search?client=chrome-omni&..............&q=ul%2Fg..............
So check if the URL has &q= parameter that matches e.g. \w+%2Fg and abort it using a blocking onBeforeRequest listener, then update the tab URL to http://ultra.com/g. You can find examples here on StackOverflow and in the documentation.
I'm developing a simple extension for word translating.
What I'm stuck with is I'm using an internal page for settings. What I want to do is passing an array (or any data at least -i'm that devastated-) from this internal page to content script.
I've tried
content script
var port = chrome.runtime.connect();
window.addEventListener("message", function(event) {
// We only accept messages from ourselves
if (event.source != window)
return;
if (event.data.type && (event.data.type == "FROM_PAGE")) {
window.alert("Content script received: " + event.data.text);
port.postMessage(event.data.text);
}
}, false);
internal page's javascript
window.postMessage({ type: "FROM_PAGE", text: "Hello from the webpage!" }, "*");
Internal page is a html file. I want to use it as a settings page. Like AdBlock's "options" page which you can reach from its popup page.
manifest.json
{
"manifest_version": 2,
"name": "Jun",
"description": "See selected words' equivalent.",
"version": "1.0",
"background": {
"scripts": ["background.js"]
},
"browser_action": {
"default_icon": "icon.png",
"default_title": "Click Here!",
"default_popup": "popup.html"
},
"permissions": [
"storage",
"tabs"
],
"content_scripts": [{
"matches": ["http://*/*", "https://*/*"],
"css": ["/lib/jquery-ui.min.css"],
"js": ["/lib/jquery-3.1.1.js", "/lib/jquery-ui.min.js", "/lib/jquery.mark.js", "content.js"],
"run_at": "document_end"
}]
}
and some other useless things so far.
For clarification; extension page link
chrome-extension://inbhgljjpkpodbamjfkehcmloabbhccn/category_settings/categorySettings.html
I hope I could express myself.
Thanks in advance!
PS: You can see project from https://github.com/MisketAdam/Jun
PS2:
extension directory
.
|──*etc*
|──content.js
|──category_settings/
| |──categorySettings.js
| |──categorySettings.css
| |──categorySettings.html
| |──*etc*
SOLVED
Yeah so... After reading https://developer.chrome.com/extensions/messaging throughly and trying out
chrome.runtime.sendMessage
at the internal page's javascript and handling it from background page got it working.
Thanks everyone!
As you can see, I have a problem with onclick event in chrome extension and I need your help.
$(function jony() {
jQuery.each( jQuery('img'), function() {
jQuery(this).attr('src', 'urlimage');
});
});
chrome.browserAction.onClicked.addListener(function(tab) {
jony();
});
Manifest:
{
"manifest_version": 2,
"name": "Jonyzátor",
"description": "Change images on page to JoNy!",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_title": "Klikni na mě!"
},
"permissions": [
"activeTab",
"https://ajax.googleapis.com/"
],
"content_scripts": [ {
"js": [ "jquery.js", "jonyza.js"],
"matches": [ "http://*/*", "https://*/*"]
}]
}
The scope in which jony is defined is limited to $(); outside it's simply undefined.
function jony() {
jQuery.each( jQuery('img'), function() {
jQuery(this).attr('src', 'urlimage');
}
$(jony); // Will execute on page load
// and you can still use it here
I'm not sure it was the logic you intended - do you want it to run both at page load AND when you click?
You can't use browserAction API in content scripts. The proper place for it would be a background (or event) script, and then you can message your content script to do something.
I want to be able to click the HTML div button and relocate the current tab.
redirect.js
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.update(tab.id, {
url: "http://www.roblox.com/"
});
});
popup.html
<html>
<script src="redirect.js"></script>
</html>
manifest.json
{
"name": "z",
"version": "0.1",
"description": "z",
"background": {
"page":"popup.html"
},
"manifest_version": 2,
"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],
"js": ["redirect.js"]
}
],
"permissions": [
"tabs",
"bookmarks",
"<all_urls>",
"unlimitedStorage"
]
}
Those are my current scripts, it doesn't let me use onclick when I add a div button, I need that help mainly.
1: you did not specify the browserAction in the manifest.json. If you want to use chrome.browserAction.onClicked, you have to specify a browser action. add an extension icon.
2: you do not need content script
3: if you only want a single redirect function, you do not need to request bookmarks and all urls and storage permissions.
so here is your manifest.json should be :
{
"name": "z",
"version": "0.1",
"description": "z",
"background": {
"page":"popup.html"
},
"manifest_version": 2,
"permissions": [
"tabs"
],
"browser_action": {
"default_icon": {
"19": "icon.png" //you have to put an image icon.png in to the folder.
},
"default_title": "Redirect" //optional
}
}
Then it will works.
plus, do not name your background file as "popup.html", popup usually used as a popup window.
you can also download the extension here, only this script will redirect to google after click. you can modify it yourself.
https://drive.google.com/file/d/0B-gxNl6LTj5jdkZPTm9qQXB4S1U/view?usp=sharing
I am trying to create a quick Chrome extension (complete beginner) and just want to display an alert whenever the icon is clicked, so I tried the following:
manifest.json
{
"name": "Something",
"version": "1.0",
"manifest_version": 2,
"description": "Woohoo",
"browser_action": {
"default_icon": "icon.png"
},
"content_scripts" : [{
"matches": ["<all_urls>"],
"js" : ["bgscript.js"]
}]
}
bgscript.js
chrome.browserAction.onClicked.addListener(function(tab) {
alert('icon clicked')
});
However when I click on my icon, nothing happens! Looking at the above - can anyone spot why this wouldn't work?
In order to be notified for browser-action's onClicked event, you need a background-page (or better yet event-page), not a content-script.
Change your manifest like this:
// Replace that:
"content_scripts" : [{...}]
// with this:
"background": {
"persistent": false,
"scripts": ["bgscript.js"]
}
If you want the browser-action to invoke something on a content-script, you need to communicate throught the background-page using Message Passing (e.g. Simple one-time requests).
E.g.:
manifest.json
{
"name": "Something",
"version": "1.0",
"manifest_version": 2,
"description": "Woohoo",
"browser_action": {
"default_icon": "icon.png"
},
"background": {
"persistent": false,
"scripts": ["background.js"]
},
"content_scripts" : [{
"matches": ["<all_urls>"],
"js" : ["content.js"]
}]
}
background.js
chrome.browserAction.onClicked.addListener(function (tab) {
/* Send a message to the active tab's content script */
chrome.tabs.sendMessage(tab.id, { action: 'saySomething' });
});
content.js
chrome.runtime.onMessage.addListener(function (msg) {
/* We received a message, let's do as instructed */
if (msg.action === 'saySomething') {
alert('something');
}
});