I run a Chrome extension which analyses the content on a website. With migrating to Manifest 3 my extension started giving me a hard time as I won't be able to use background.html (Service worker registration failed "background" : { "service_worker": "background.html" },
Can anyone please help me with how to convert background.html ?
Here is my manifest.json and background.html
Manifest
{
"manifest_version": 3,
"name": "TB",
"version": "2.3",
"host_permissions": [
"<all_urls>"
],
"permissions": [
"tabs",
"cookies",
"activeTab",
"storage",
"unlimitedStorage",
"geolocation"
],
"background" : {
"service_worker": "background.html"
},
"icons": {
"16": "img/ic_16.png",
"48": "img/ic_48.png",
"64": "img/ic_64.png",
"128": "img/ic_128.png",
"256": "img/ic_256.png"
},
"content_scripts":[{
"matches": [
"*://*.site/*",
"*://xxxxxxx.xx.xx/*",
"*://www.xxxxx.xx.xx/*",
"*://xxx.xxxxxx.xx/*",
"*://xxxx.xxxxxx.com/*"
],
"js": [
"libs/jquery.js",
"libs/md5.js",
"ex.js"
],
"run_at": "document_end"
}],
"web_accessible_resources": [{
"resources": ["injected.js", "img/bg.gif", "img/bg.webp"],
"matches": [],
"extension_ids": []
}],
"action": {
"default_icon": "img/tb.png",
"default_title": "TB",
"default_popup": "index.html"
}
}
Background.html
"<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="libs/md5.js"></script>
<script src="libs/jquery.js"></script>
<script type="text/javascript" src="bg.js"></script>
</head>
<body></body>
</html>
Related
Am looking to migrate a manifest V2 extension to V3, but concerned extension might be disabled due to change in manifest permissions. My original plan was to create a new beta extension with existing V2 code and perms, install it from the chrome store locally, then update to manifest V3 perms and see what happens, but chrome store no longer accepts new V2 extensions.
Either the official documentation is purposely vague on the matter of permissions, or I missed something. Other SO questions I see are very specific. Hoping someone with more experience sees this and might be able to spot right away if anything may trigger with the manifest upgrade below. Ideally it's a smooth process given were already requesting a broad match on one of the content script blocks, and the permission list is also reduced.
Current manifest V2 (non pertinent values redacted)
{
"manifest_version": 2,
"name": "...",
"short_name": "...",
"description": "...",
"version": "1.8.0",
"background": {
"page": "background.html"
},
"content_scripts": [
{
"matches": ["*://*.example.com/*",
"*://example2.co/*",
"*://*.example2.com/*",
"http://www.example3.com/*", "https://www.example3.com/*"],
"css": [],
"js": ["js/content_script1.min.js"],
"run_at":"document_end"
},
{
"matches": ["http://*/*", "https://*/*"],
"exclude_matches": [
"*://example2.co/*",
"*://*.example2.com/*",
"*://*.example3.com/*"
],
"css": [],
"js": ["js/content_script2.min.js"]
}
],
"browser_action": {
"default_icon": "images/icon.png",
"default_popup": "popup.html",
"default_title": "..."
},
"permissions": [
"activeTab",
"background",
"storage",
"tabs",
"notifications",
"http://*/",
"https://*/"
],
"content_security_policy": "script-src 'self' https://ssl.google-analytics.com https://static.example.com https://api.example.com https://plugin.example.com https://example.com https://s3.us-west-2.amazonaws.com; object-src 'self'",
"externally_connectable": {
"matches": ["*://example.com/*"]
},
"icons": { ... },
"web_accessible_resources": ["/*.png", "/*.svg"]
}
New manifest V3
{
"manifest_version": 3,
"name": "...",
"version": "2.0.0",
"description": "...",
"minimum_chrome_version": "93",
"permissions": [
"storage",
"alarms"
],
"host_permissions": [
"*://*/*"
],
"web_accessible_resources": [
{
"resources": [
"/assets/*"
],
"matches": [
"*://*/*"
]
},
{
"resources": [
"chunks/*-*.js",
"ui/content-script/index.js"
],
"matches": [
"https://*/*",
"http://*/*",
"*://*/*"
]
}
],
"action": {
"default_title": "...",
"default_popup": "ui/popup/index.html",
"default_icon": { ... }
},
"icons": { ... },
"background": {
"service_worker": "service-worker.js",
"type": "module"
},
"content_scripts": [
{
"js": [
"ui/content-script/import-index.js"
],
"matches": [
"https://*/*",
"http://*/*"
],
"run_at": "document_end"
}
],
"externally_connectable": {
"matches": [
"*://example.com/*"
]
}
}
I have a Chrome Extension project, the structure looks like this:
project/
dist/
index.html
manifest.json
When I go More Tools -> Extensions -> Load Unpacked Extensions
I choose the root of the project, and it works! But I can't figure out how it knows to load dist/index.html? The manifest.json file doesn't say anything about dist/index.html, so how does Chrome know how to load the extension?
I built this extension a few months ago, and now I can't figure out how it works lol.
the manifest.json file looks like this verbatim:
{
"manifest_version": 2,
"name": "Suman Generator",
"description": "This extension allows the user to generate test skeletons.",
"version": "1.223",
"browser_action": {
"default_icon": "icon.png"
},
"options_page": "options.html",
"options_ui": {
"page": "options.html",
"chrome_style": true
},
"devtools_page": "aspects/dev-tools/dist/suman-dev-tools.html",
"optional_permissions": [
"<all_urls>"
],
"permissions": [
"management",
"activeTab",
"webNavigation",
"storage",
"*://*/",
"http://*/",
"https://*/",
"background",
"browser",
"tabs",
"identity",
"identity.email",
"https://www.googleapis.com/",
"pageAction",
"notifications",
"clipboard",
"clipboardWrite",
"clipboardRead",
"unlimitedStorage",
"webRequest",
"userinfo",
"webRequestBlocking",
{
"socket": [
"tcp-connect:*:*"
]
}
],
"web_accessible_resources": [
"modal-iframe.html"
],
"icons": {
"16": "icons/icon16.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
},
"omnibox": {
"keyword": "suman:chrome"
},
"oauth2": {
"client_id": "5461307462-7geu9374.apps.googleusercontent.com",
"scopes": [
"https://www.googleapis.com/auth/userinfo.profile",
"https://www.googleapis.com/auth/chromewebstore.readonly"
]
},
"key": "MIIBC57LwMgUdRxfY4I40oAiKy57o3tWF/A1BrTNY0nQIDAQAB",
"short_name": "Suman Short Name",
"offline_enabled": true,
"background": {
"page": "background.html",
"persistent": true
},
"content_scripts": [],
"content_security_policy": "script-src 'self' https://plus.google.com 'unsafe-inline' 'http' 'https' 'unsafe-eval' '*'; object-src '*';"
}
Here I have taken permission for all the needed thing, if something missing here please let me know.
Manifest.json
{
"manifest_version": 2,
"name": "SearchMood",
"description": "This extension shows Google Web Search and Google Image
Search result.",
"version": "1.4",
"author":"Searchmood",
"browser_action": {
"default_icon": {
"128": "icon-128.png",
"16": "icon-16.png",
"48": "icon-48.png"
},
"default_title": "SearchMood",
"default_popup": "background.html"
},
"chrome_url_overrides" : {
"newtab": "popup.html"
},
"icons": {
"128": "icon-128.png",
"16": "icon-16.png",
"48": "icon-48.png"
},
"background": {
"scripts": [ "background.js","popup.js" ]
},
"permissions": [
"activeTab","management","https://ajax.googleapis.com/"
],
"content_scripts": [
{
"matches": [ "http://search.searchmood.com/*" ],
"js": [ "js/restoremodal.js" ],
"all_frames": true,
"run_at": "document_start"
}
],
"externally_connectable": {
"matches": ["http://*.searchmood.com/*"]
}
}
Script on my web page I have:
<div class="links">
<ul>
<li>Terms&Conditions</li> |
<li>Privacy policy</li>|
<li>Contact US</li>
<li><span id="restoreLink" onclick="adi();">Reset Chrome</span></li>
</ul>
</div>
<script type="text/javascript">
function adi(){
var editorExtensionId = "pokioadkjpcbalcpfidmlebofahebkhb";
// Make a simple request:
chrome.runtime.sendMessage(editorExtensionId, {request: "uninstall"});
}
</script>
And this is the code in my extension to listen To this message I have put this code in popup.js. Please guide me where to put that also.
chrome.runtime.onMessageExternal.addListener(
function(request, sender, sendResponse) {
if (request == "uninstall") {
var id = chrome.app.getDetails().id;
chrome.management.setEnabled(id, false);
}
});
This the script I have written. I have some other codes also but that is also not working.
Yes I got the answer In the content Script File We can write code for taking the element from Website And their we will use SendMessage function Make sure You have taken permission for "Management" in manifest.json And persistent in Menifest.json should be "false".
Then you can use onmessage function and disable your extension Codes for your reference:
**HTML**`<span id="restorelink"> disable chrome extension</span>`
**menifest.json**
{
"manifest_version": 2,
"name": "name",
"description": "describe about you extension",
"version": "1",
"browser_action": {
"default_icon": {
"128": "icon-128.png",
"16": "icon-16.png",
"48": "icon-48.png"
},
"background": {
"scripts": [ "background.js"],
"persistent": false
},
"permissions": [
"management"
],
"content_scripts": [
{
"matches": [ "http://your site url where you want to apply the change, you can use more than one seperating with "," ],
"js": [ "restoremodal.js" ],
"all_frames": true
}
]
}
**restoremodal.js**
document.getElementById("restoreLink").addEventListener("click", adi);
function adi(){
chrome.runtime.sendMessage({ value: "anything"});
}
**Background.js**
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
if (request.value=="anything") {
var id = chrome.app.getDetails().id;
chrome.management.setEnabled(id, false);
}
});
I'm sure that it is I tried with/without BOM and I still get this error :
{
"manifest_version": 2,
"default_locale": "en",
"name": "__MSG_ext_name__",
"description": "__MSG_ext_description__",
"version": "1.6.0",
"icons": {
"16": "icon_16.png",
"48": "icon_48.png",
"128": "icon_128.png"
},
"browser_action": {
"default_icon": "icon_19.png",
"default_popup": "popup.html"
},
"background": {
"page": "background.html"
},
"options_page": "options.html",
"permissions": [
"tabs"
],
"content_scripts": [
{
"matches": [
"http://*/*",
"https://*/*"
],
"js": [
"scripts/content.js"
],
"run_at": "document_start",
"all_frames": true
}
]
}
I used a program to mass convert all my files in UTF-8, now it works, I think as 方 觉 said, the problem was coming from another file than the manifest.
this works fine in browserAction..
but when i switch it pageAction.. even the icon doesnot show up
background.html
<html>
<head>
<script>
// Called when the user clicks on the browser action.
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.create({'url':'http://google.com/search?q=site:'+window.location.host});
});
</script>
</head>
</html>
manifest.json
{
"name": "linkcheck",
"description": "check link.",
"version": "1.1.1",
"
background_page": "background.html",
"permissions": ["tabs", "http://*/*","https://*/*"],
"browser_action": {
"name": "linkcheck",
"default_icon": "icon.png"
},
"icons": {
"128": "icon128.png",
"48": "icon48.png"
},
"content_scripts": [
{
"matches": ["https://www.google.com/*"],
"js": ["myscript.js"],
"run_at": "document_end"
}
]
}
Well for pageAction, you would need to enter another manifest property:
{
"name": "My extension",
...
"page_action": {
"default_icon": "icons/foo.png", // required
"default_title": "Do action", // optional; shown in tooltip
"default_popup": "popup.html" // optional
},
...
}
Then you need to either hide or show.
chrome.pageAction.show(integer tabId)