I have a chrome extension that uses browser actions, as I want it to run on all sites, bar 1 (matching ".pannus." which is an internal dev site).
I can't work out how to achieve this, I have tried using the manifest and regex in PageStateMatcher.
manifest.json
{
"name": "...",
"description": "...",
"version": "0.0.2",
"permissions": ["contextMenus", "declarativeContent"],
"background": {
"persistent": false,
"scripts": ["background.js"]
},
"content_scripts": [{
"matches": ["<all_urls>"],
"js": ["content.js"],
"css": [ "style.css" ]
}],
"browser_action": {
"default_icon": {
...
}
},
"icons": {
...
},
"manifest_version": 2
}
If I add "exclude_matches": ["*://*.pannus.*"], here, I get an error:
Invalid value for 'content_scripts[0].exclude_matches[0]': Empty path.
I have also tried:
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [
new chrome.declarativeContent.PageStateMatcher({
pageUrl: {
schemes: ['https', 'http'],
urlMatches: '^((?!.pannus.).)*$'
},
})
],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
But I get the error:
Could not parse regular expression '^((?!.pannus.).)*$': invalid perl operator: (?!
What is the best way to disable my chrome extension on certain sites? Or, failing that, not inject the extensions content script into the excluded hosts?
Related
I am having an issue with the executeScript function with using Vite React chrome extension tools with CRXJS
I am receiving the error message "Uncaught (in promise) Error: could not get url" when trying to use it.
The initial injection of the content.tsx file from the manifest.json is working fine, but the error is occurring when I call chrome.scripting.executeScript.
my manifest.json
{
"manifest_version": 3,
"name": "CRXJS React Vite Example",
"version": "0.0.1",
"action": { "default_popup": "index.html" },
"content_scripts": [
{
"js": ["src/content.tsx"],
"matches": ["*://*.github.com/*"]
}
],
"background": { "service_worker": "src/background.ts"},
"permissions": ["webRequest", "webNavigation", "tabs", "activeTab", "scripting"],
"host_permissions": ["<all_urls>"],
"web_accessible_resources": [
{
"resources": ["src/assets/*"],
"matches": ["https://*/*"]
}
]
}
Here is my use of chrome.scripting in background.ts:
const inject = (tabId) => {
chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
if (tabs[0].url?.includes("some/search/string")) {
const jsFiles = chrome.runtime.getManifest().content_scripts[0].js;
chrome.scripting.executeScript({
target: { tabId },
files: jsFiles,
})
.then(() => {
console.log("injected");
});
}
});
};
I also tried with files: ["content.tsx"], or files: ["src/content.tsx"], but I received the error: "Uncaught (in promise) Error: Could not load file: 'src/content.tsx'" on chrome dev tools
The only way to not have Could not load file error is to put the bundled file name taken from chrome.runtime.getManifest().content_scripts[0].js ("src/content.tsx-loader.js")
I have a chrome extension,
I am trying to catch webRequest for example onBeforeRequest, but it doesn't fire on some web requests. Is it even possible to not have a onBeforeRequest fired on some http or https website?
or I am confusing the url patterns somewhere?
This is the code in background.js. beforeRequest is never executed on some websites.
Not if I try on this website for example: https://discourse.mozilla.org/t/onbeforerequest-event-not-fired-firefox-is-started-with-command-line-options/33557
Is it possible that url patterns
"<all_urls>" or "*://*/*" don't match with the URL?
chrome.webRequest.onBeforeRequest.addListener(
function(details){
beforeRequest(details.tabId);
}, {urls: ["<all_urls>"],types: ["main_frame"]}, [ "blocking" ]);
This is the manifest.json
{
"name": "Example",
"version": "1.0",
"manifest_version": 2,
"description": "Prototype",
"browser_action": {
"default_icon": "img/grey-16.png",
"default_popup": "popup/index.html"
},
"permissions": [
"tabs",
"background",
"<all_urls>",
"activeTab",
"webRequest",
"webRequestBlocking",
"storage",
"downloads",
"webNavigation"
],
"content_scripts" : [
{
"js": ["content_scr.js"],
"run_at": "document_start",
"all_frames" : true,
"matches": ["*://*/*"]
}
],
"background": {
"scripts" : ["background.js"],
"persistent": true
},
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"
}
I'm trying to run window.location.href= $newURL after opening a new tab by using executeScript.
Error:
Unchecked runtime.lastError: Cannot access contents of url "https://www.google.com/_/chrome/newtab?ie=UTF-8". Extension manifest must request permission to access this host.
What permission still needed to be added to this manifest.json
{
"name": "Getting Started Example",
"version": "1.0",
"description": "Build an Extension!",
"manifest_version": 2,
"background": {
"scripts": ["background.js"],
"persistent": false
},
"permissions": ["activeTab", "tabs", "declarativeContent", "*://*/*", "storage"],
"page_action": {
"default_popup": "popup.html"
}
}
and the running code for the new tab in background.js
chrome.runtime.onInstalled.addListener(function() {
chrome.tabs.onCreated.addListener(function( tab ){
tab.url = "https://mahmoudzakaria90.github.io/HelloZeka/public/"
chrome.tabs.executeScript({
file: './inject.js'
})
})
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [new chrome.declarativeContent.PageStateMatcher()
],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
});
This is my first chrome extension so please forgive me for asking such a novice question. My extension currently only works on 'developer.chrome.com' (icon has color) but I would like it to work on amazon.com (icon is gray). From googling, I didn't see anyone else come up with the same problem so I'm guessing it must be a mistake on my end. Here is my manifest.json:
{
"name": "Reviews Extension",
"version": "1.0",
"description": "Get additional reviews from third party retailers",
"permissions": [
"https://api.walmartlabs.com/",
"https://www.amazon.com/",
"activeTab",
"declarativeContent",
"storage"
],
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["content.js"]
}
],
"options_page": "options.html",
"background": {
"scripts": [
"background.js"
],
"persistent": false
},
"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"
},
"manifest_version": 2
}
UPDATE:
When I fiddled with background.js on the pageUrl: {hostEquals: 'developer.chrome.com'}, I found when I delete the URL, it no longer works on developer.chrome.com. But when I changed it to https://www.amazon.com/ in place of developer.chrome.com, it didn't work on amazon's main page either.
'use strict';
chrome.runtime.onInstalled.addListener(function () {
chrome.storage.sync.set({ color: '#3aa757' }, function () {
console.log('The color is green.');
});
chrome.declarativeContent.onPageChanged.removeRules(undefined, function () {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [new chrome.declarativeContent.PageStateMatcher({
pageUrl: { hostEquals: 'developer.chrome.com' },
})],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
});
UPDATE 2:
Got it working by change the pageURL in background.js. It had to be formatted in a very specific way: www.amazon.com, NOT https://www.amazon.com, amazon.com, or any other variations. I am still unable to add multiple websites by adding commas in between, any ideas there?
Try adding more conditions and using hostContains or urlContains instead of hostEquals.
For example:
chrome.declarativeContent.onPageChanged.removeRules(undefined, function () {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [
new chrome.declarativeContent.PageStateMatcher({
pageUrl: { hostContains: '.developer.chrome.com' },
}),
new chrome.declarativeContent.PageStateMatcher({
pageUrl: { hostContains: '.amazon.com' },
})
],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
Try adding '*' to expand which pages of Amazon your extension will work on.
For example:
"https://*.amazon.com/*"
https://developer.chrome.com/apps/match_patterns
How can i change the CSS file declared in content_scripts (manifest.json)?
I need to change it from background.js (style.css to style2.css)
Is it possible to do that?
The manifest.json:
{
"manifest_version": 2,
/* ... */
/* ... */
"background": {
"scripts": [
"files/script/jquery-3.2.1.min.js",
"files/script/background.js"
]
},
"permissions": [
"tabs",
"http://*/*",
"https://*/*",
"background",
"browsingData",
"cookies",
"webRequest",
"management",
"storage"
],
"content_scripts": [{
"matches": ["*"],
"css": [
"files/css/style.css"
]
}]
}
You cannot change declared CSS in the manifest file.
But in order to run custom CSS programmatically from background script, you can use chrome.tabs.insertCSS.
// use a file
chrome.tabs.insertCSS({file: "style2.css"});
// use a CSS string
chrome.tabs.insertCSS({code: "body { background: red }" });