I am trying to match on a URL pattern to have my content script run against. The http:// pattern matches, but if I go to the same site, minus the http://, it doesn't run. How do I indicate that I want the plugin to run even if the http:// is missing.
Here is my mainfest:
{
"name": "BrowserExtension",
"version": "0.0.1",
"manifest_version": 2,
"description" : "Description ...",
"icons": { "16": "icons/16x16.png", "48": "icons/48x48.png", "128": "icons/128x128.png" },
"omnibox": { "keyword" : "yeah" },
"browser_action": {
"default_icon": {
"19": "icons/19x19.png",
"38": "icons/38x38.png"
},
"default_title": "That's the tool tip",
"default_popup": "browseraction/popup.html"
},
"chrome_url_overrides" : {
"newtab": "newtab/newtab.html"
},
"content_scripts": [
{
"matches": ["https://www.supremenewyork.com/checkout"],
"js": ["content.js", "jquery.js"]
},
{
"matches": ["*://www.supremenewyork.com/shop/*"],
"js": ["cart.js", "jquery.js"]
}
],
"permissions": [
"storage"
],
"devtools_page": "devtools/devtools.html"
}
When I go to this page, the javascript doesn't run:
http://www.supremenewyork.com/shop/shirts/supreme-pink-panther-denim-shirt
Related
I'm trying to make a Chrome extension that opens a local exe (nativeMEssaging) but when I'm trying to load it I have this error: It doesn't know the key path and type so how can I do?
Here is my manifest.json:
{
"name": "debug.reader.eid",
"description": "Console app use to read an eid and send date to extension",
"path": "C:\\debug.reader.eid\\debug.reader.eid.exe",
"type": "stdio",
"externally_connectable": {
"matches": [
"https://*.extranet-test.debug.be/*",
"*://localhost/*"
]
},
"background": {
"service_worker": "background.js"
},
"author": "debug",
"icons": {
"128": "addon-debug.png"
},
"manifest_version": 3,
"permissions": [
"nativeMessaging"
],
"version": "1.0",
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"content.js"
],
"run_at": "document_start"
}
],
"action": {
"default_icon": {
"16": "addon-debug.png"
},
"default_title": "test",
"default_popup": "popup.html"
}
}
I have a chrome extenison but i can't figure out how to access the data in the devtools network tab and send to the popup. Any suggestion?
it's basically a bug reporting chrome extension where you can take screenshots, create issue, and I need the network log (and/or console)
manifest.json
{
"manifest_version": 2,
"name": "my-chrome-extension",
"description": "Chrome Extension for report bug",
"version": "1.0",
"background": {
"scripts": [
"js/background.js"
],
"persistent": false
},
"icons": {
"16": "./icon.png",
"36": "./icon.png",
"48": "./icon.png",
"120": "./icon.png"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"js/vendor.js", "js/content_script.js"
]
}
],
"web_accessible_resources": [
"inject-script.js",
"js/inject-script.js"
],
"browser_action": {
"default_popup": "popup.html",
"default_title": "PerfWatch"
},
"permissions": [
"tabs",
"activeTab",
"storage"
]
}
You cant access it directly. Only via API like webRequest via bg script.
Example:
chrome.webRequest.onBeforeRequest.addListener((details) => {
//This identifies a redirect to another page
if (details.url.indexOf("Target") && details.method === "OPTIONS/..." && details.initiator.indexOf("Source")) {
chrome.tabs.sendMessage(details.tabId, {
message: "xyz"
});
}
})
Your manifest.json must include the webRequest permission in order to access the webRequests:
{
"manifest_version": 2,
"name": "my-chrome-extension",
"description": "Chrome Extension for report bug",
"version": "1.0",
"background": {
"scripts": [
"js/background.js"
],
"persistent": false
},
"icons": {
"16": "./icon.png",
"36": "./icon.png",
"48": "./icon.png",
"120": "./icon.png"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"js/vendor.js", "js/content_script.js"
]
}
],
"web_accessible_resources": [
"inject-script.js",
"js/inject-script.js"
],
"browser_action": {
"default_popup": "popup.html",
"default_title": "PerfWatch"
},
"permissions": [
"tabs",
"activeTab",
"storage",
"webRequest"
]
}
Hint:
There are additional APIs like webNavigation and webRequestBlocking if you need more funtionallity.
I'm trying to write a Chrome extension where part of the action is changing style of elements to those provided in css file. CSS content is internal for extension and not not downloaded from anywhere. It is exactly in the same location as any other file for extension.
files are following:
manifest.json
{
"name": "Test extenstion",
"description": "Test Extension!",
"version": "1.0",
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"action": {},
"permissions": ["storage", "activeTab", "scripting"],
"host_permissions": ["*://*/*"],
"icons": {
"16": "/images/get_started16.png",
"32": "/images/get_started32.png",
"48": "/images/get_started48.png",
"128": "/images/get_started128.png"
}
}
background.js:
chrome.action.onClicked.addListener((tab) => {
chrome.scripting.executeScript({
target: {tabId: tab.id},
files: ['detection-script.js']
});
});
chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
if (changeInfo.status === 'complete') {
chrome.scripting.insertCSS({
target: { tabId: tabId },
files: ['./elements-highlight.css']
})
.then(() => {
console.log("INJECTED THE FOREGROUND STYLES.");
})
.catch(err => console.log(err));
}
});
In detection-scrpt.js I'm just running script that updates style of each element to style defined in elements-highlight.css. This part is working, I can see styles of element on the website being updated.
What I cannot get is why CSS is not injected? I figured that I had to add host_permissions to remove error:
Extension manifest must request permission to access the respective host.
But beside that I'm not sure what might be missing.
EDIT based on wOxxOm's comment
Dropped only chrome.tabs.onUpdated and updated manifest.json like this
{
"name": "Getting Started Example",
"description": "Build an Extension!",
"version": "1.0",
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"action": {},
"permissions": ["storage", "activeTab", "scripting"],
"host_permissions": ["*://*/*"],
"icons": {
"16": "/images/get_started16.png",
"32": "/images/get_started32.png",
"48": "/images/get_started48.png",
"128": "/images/get_started128.png"
},
"content_scripts": [
{
"matches": ["*://*/*"],
"css": ["elements-highlight.css"]
}]
}
I don't see any change in behavior. Still no change in CSS, beside adding new class to elements.
I get this error in Firefox:
There was an error during the temporary add-on installation.
Error details ▼
File red_apples.zip does not contain a valid manifest
This is the extension I'm trying to port. Here's the manifest:
{
"manifest_version": 2,
"name": "Red Apples",
"permissions": [
"tabs", "activeTab"
],
"background": {
"persistent": false,
"scripts": [
"background.js"
]
},
"version": "0.0.0.2",
"icons": {
"16": "icon16.png",
"48": "icon48.png",
"128": "icon128.png"
},
"browser_action": {
"default_icon": "icon16.png",
"default_title": "Red Apples",
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"script.js"
]
}
]
}
At the bottom of this tutorial it says there's a 99% chance it works without modification, if it passes the test here. But it passes the test and still doesn't work.
I get the manifest error both for the version packed with Chrome, and for the version just compressed as .zip.
In my content script I do
chrome.windows.create({url: "local.html", type: "popup"});
however, no window ever shows up.
Do I need to change my manifest file first? Why doesn't this function create a new window ever?
I have tabs enabled like so
{
"name": "Tool",
"version": "0.0.1",
"manifest_version": 2,
"description": "",
"homepage_url": "",
"icons": {
"16": "icons/on.png",
"48": "icons/on.png",
"128": "icons/on.png"
},
"default_locale": "en",
"background": {
"page": "src/bg/background.html",
"persistent": true
},
"browser_action": {
"default_icon": "icons/on.png",
"default_title": "browser action demo"
},
"permissions": [
"<all_urls>","tabs", "webNavigation"
],
"content_scripts": [
{
"run_at": "document_end",
"matches": [
"<all_urls>"
],
"js": [
"src/lib/jquery.min.js", "src/inject/inject.js"
],
"css": [
"src/inject/inject.css"
]
}
]
}
You are trying to call this from the content script.
Quoting the docs:
However, content scripts have some limitations. They cannot:
Use chrome.* APIs (except for parts of chrome.extension)
If you need to initiate some action that uses Chrome API from the content script, you have to message your background script to do this. See Architecture overview and Messaging.