I'm creating a chrome extension but I'm having some difficulties in use notifications webkit. When I try to display a notification, an exception is thrown:
Uncaught Error: SecurityError: DOM Exception 18
Bellow follow my Javascript code:
var icon = 'icon_48.png';
var title = 'Test Plugin';
var body = message;
var popup = window.webkitNotifications.createNotification(icon, title, body);
popup.show();
Bellow follow my manifest.json:
{
"name": "Test Plugin",
"version": "1.0.6",
"manifest_version": 2,
"description": "This is a test",
"browser_action": {
"default_icon": "images/icon_32.png",
"default_popup": "popup.html"
},
"icons": {
"128": "images/icon_128.png",
"16": "images/icon_32.png",
"48": "images/icon_48.png"
},
"permissions": [
"http://*/*",
"https://*/*",
"contextMenus",
"tabs",
"notifications",
"management",
"webRequest"
],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["webtoolkit-sha1.js","content.js"],
"run_at": "document_end",
"css" : ["css/style.css"]
}
],
"web_accessible_resources": ["webtoolkit-sha1.js","inject.js","icon_48.png"]
}
What am I doing wrong?
Thanks everybody!
Information Update:
manifest.json has the attribute notifications in permissions section but when I print the webkitNotifications.checkPermission() the result was 1 (PERMISSION_NOT_ALLOWED).
The notifications permission only applies to the extension's process. In order to get your code to work, a background (or event) page needs to be added, which creates the notification. The content script can use the messaging API to request the notification.
Related
I found this answer on how to grab the page source of current tab:
Getting the source HTML of the current page from chrome extension
However, this answer requires user to press the extension popup.
I would like to know how I can access the page source upon loading of page (without having to invoke the popup).
In my background.js I've tired this:
chrome.tabs.onUpdated.addListener(function (tabId , info) {
console.log(info)
chrome.tabs.executeScript(null, {
file: "getPagesSource.js"
}, function() {
if (chrome.runtime.lastError) {
message.innerText = 'There was an error injecting script : \n' + chrome.runtime.lastError.message;
}
});
});
but this results in the following error:
There was an error injecting script : Cannot access contents of the
page. Extension manifest must request permission to access the
respective host.
My manifest.js:
{
"name": "Getting Started Example",
"version": "1.0",
"description": "Build an Extension!",
"permissions": ["declarativeContent",
"https://www.example.com/*",
"storage",
"activeTab"],
"background": {
"scripts": ["background.js"],
"persistent": false
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["content.js"]
}
],
"options_page": "options.html",
"manifest_version": 2,
"page_action": {
"default_popup": "popup.html",
"default_icon": {
"16": "images/get_started16.png",
"32": "images/get_started32.png",
"48": "images/get_started48.png",
"128": "images/get_started128.png"
}
},
"icons": {
"16": "images/get_started16.png",
"32": "images/get_started32.png",
"48": "images/get_started48.png",
"128": "images/get_started128.png"
}
}
I don't think the issue is really with permissions because I am able to get the page source from the popup.html (which is page_action script). But I am not able to get it via "background" or "content_scripts". Why is that and what is the proper way to accomplish this?
It is about the permissions.
Your example a bit insufficient, but as I can see you are using "activeTab" permission.
According to the activeTab docs, the extension will get access (e.g. sources) to current tab after any of these actions will be performed:
Executing a browser action
Executing a page action
Executing a context menu item
Executing a keyboard shortcut from the commands API
Accepting a suggestion from the omnibox API
That's why you can get sources after opening the popup.
In order to get access to tabs without those actions, you need to ask for the following permissions:
tabs
<all_urls>
Be noted, it allows you to run content-script on every tab, not only the active one.
Here is the simplest example:
manifest.json
{
"name": "Getting Started Example",
"version": "1.0",
"description": "Build an Extension!",
"permissions": ["tabs", "<all_urls>"],
"background": {
"scripts": ["background.js"],
"persistent": false
},
"manifest_version": 2
}
background.js
chrome.tabs.onUpdated.addListener(function (tabId, info) {
if(info.status === 'complete') {
chrome.tabs.executeScript({
code: "document.documentElement.innerHTML" // or 'file: "getPagesSource.js"'
}, function(result) {
if (chrome.runtime.lastError) {
console.error(chrome.runtime.lastError.message);
} else {
console.log(result)
}
});
}
});
I have developed a extension primarily focused on chrome which works but now i need that extension to work in firefox either so I checked by loading the extension by going to about:debugging page and loading temporary addons. Currently, I go an error. I got error something like this
Reading manifest: Error processing options_page: An unexpected
property was found in the WebExtension manifest.
Reading manifest: Error processing oauth2: An unexpected property
was found in the WebExtension manifest.
Reading manifest: Error processing key: An unexpected property was
found in the WebExtension manifest.
Here is what my manifest file looks like(I removed options_page)
manifest.json
{
"version": "1.0",
"name": "Browser Extension",
"manifest_version": 2,
"description":
"This extension allow the user to select the text and redirect to the application",
"page_action": {
"default_title": "Select Text",
"default_popup": "index.html"
},
"icons": {
"16": "img/browser16.png",
"48": "img/browser48.png",
"128": "img/browser128.png"
},
"background": {
"scripts": ["extension/js/background.js"],
"persistent": true
},
"content_scripts": [
{
"matches": [
"https://mail.google.com/mail/*/*",
"http://mail.google.com/mail/*/*"
],
"js": ["extension/js/jquery.min.js", "extension/js/content.js"],
"css": ["extension/css/main.css"],
"run_at": "document_end"
}
],
"permissions": [
"contextMenus",
"tabs",
"storage",
"webNavigation",
"notifications",
"cookies",
"identity",
"*://mail.google.com/mail/*/*",
"https://www.googleapis.com/*",
"https://*.googleusercontent.com/*"
],
"web_accessible_resources": ["img/browser128.png", "img/ios-link.svg"],
"oauth2": {
"client_id":
"114446495690-8ejpdgvmn8vc9pblteupetas.apps.googleusercontent.com",
"scopes": ["profile", "https://www.googleapis.com/auth/gmail.readonly"]
},
"key":
"MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAnqFjzbt+LtejD1JhOyMUbejOHdLoemzryr+ZQHK2CEKuI0yVVYToFs7eNusH/hfxhnyF27G4BU8apsTc695EpVQGD0ANKdt6BjubRnA/4VcdkmfdD3D9nsdCc+fHkINRU5e05grfs/BETWW/JAUULduaNWGfhT7"
}
How do i resolve above issues to make it firefox compatible as well?
I have an extension that gets JSON data from a site for a list of characters and their resources when chosen from a menu. I'm using a single html page and trying to update it with javscript to modify the code for the menu. The only thing is that I can't get the content script injected/loaded into the html page.
When my extension is run, the path for the rem.htm file is shown as 'moz-extension://a02e52b1-e41d-4d28-844b-a8466a1dd67b/rem.htm' which gives an invalid error for the 'matches' key in the console.
What else can I use?
manifest.json:
{
"description": "Resource Manager for Path of Exile",
"manifest_version": 2,
"name": "Path of Exile Resource Manager",
"version": "1.0",
"content_scripts":
[
{
"matches": ["file:///rem.htm"],
"js": ["modify-page.js"]
}
],
"background":
{
"scripts": ["background.js"]
},
"browser_action":
{
"default_icon":
{
"16": "icons/rem_16.png",
"32": "icons/rem_32.png",
"64": "icons/rem_64.png"
}
},
"permissions":
[
"*://www.pathofexile.com/",
"webRequest",
"tabs",
"activeTab"
]
}
I figured it out. I didn't realize I had modify-page in a separate directory. I was then able to add '' to matches and it finally worked!
I'm trying to build a basic extension that injects an alert script in to every page loaded. But it seems that the script is injecting only to some pages (most pages it's not injected in to), and I couldn't find a pattern in how it picks the pages to get injected to.
This is the manifest:
{
"name": "TestingTest",
"version": "0.1.1",
"description": "Testing Tests!",
"manifest_version": 2,
"content_scripts": [
{
"matches": ["http://*/", "https://*/"],
"js": ["content.js"],
"run_at": "document_end"
}
],
"background": {
"page": "background.html"
},
"permissions": [
"tabs",
"http://*/", "https://*/",
"cookies"
],
"icons": {
"16": "my_icon_64.png",
"32": "my_icon_64.png",
"48": "my_icon_64.png",
"128": "my_icon_64.png"
}
}
and this is ccontent.js:
alert("content script");
console.log("content script")
I'm getting the alert only on a select few pages. The pages that it's injected in to seem to vary if I load the extension in different Chrome profiles.
Your content script is probably loading only on pages where the pathname is just /. Add an extra * at the end of your url patterns:
"matches": ["http://*/*", "https://*/*"]
I want to make a browserAction extension, with an icon and a listener on it.
I have a manifest file, and a background script, the script is the following:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(null,{code:'some code here'});
});
The code works on the page, i tried it on a different way (popup and a button what fires the action). But if i try it with a browserAction onclick method, nothing happens:(
The manifest:
{
"name": "somename",
"version": "1.0",
"manifest_version": 2,
"description": "sometext",
"browser_action": {
"default_icon": "images/icon.png",
"default_title": "MyStyle"
},
"background": {
"scripts": ["js/code.js"]
},
"permissions": [
"tabs",
"https://www.examplesite.ex/*",
"http://www.examplesite.ex/*",
"http://*.ex/*"
]
}
Can anybody help me?:/
Since the original question has been solved in the comments, I'll answer the follow-up question:
"Next step to make it automatic, without any click".
This can be done easily using Content scripts. When you don't have to access global variables, the following code is sufficient. Otherwise, inject the script using the techniques as mentioned here:
js/code.js
document.title = "newtitle";
manifest.json
{
"name": "somename",
"version": "1.0",
"manifest_version": 2,
"description": "sometext",
"content_scripts": {
"js": ["js/code.js"],
"matches": [ "*://www.examplesite.ex/*", "http://*.ex/*" ]
},
"permissions": [ "*://www.examplesite.ex/*", "http://*.ex/*" ]
}