I'm trying to make a V3 Chrome Extension work, but I'm not sure how to change this V2 code that works.
manifest.json
{
"name": "Extension name",
"version": "1.0",
"manifest_version": 3,
"description": "Display API Info.",
"background": {
"service_worker": "background.js"
},
"icons": {
"16": "./icons/icon16.png",
"48": "./icons/icon48.png",
"128": "./icons/icon128.png"
},
"action": {}
}
background.js
chrome.browserAction.setBadgeBackgroundColor({ color: "green" });
const setStuff = () => {
chrome.browserAction.setBadgeText({ text: `...` });
}
const callApi = () => {
setStuff();
setTimeout(() => fetch('https://api.com/api')
.then(response => response.json())
.then(data => {
chrome.browserAction.setBadgeText({ text: `${data.info}` });
}).catch(error => console.log(error)), 5000)
}
callApi()
setInterval(function () {
callApi()
}, 300000);
Getting this error when testing it locally
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'setBadgeBackgroundColor')
Change your code that is manifest v2:
chrome.browserAction.setBadgeBackgroundColor({ color: "green" });
const setStuff = () => {
chrome.browserAction.setBadgeText({ text: `...` });
}
To this code for Chrome extension manifest v3:
chrome.action.setBadgeBackgroundColor({ color: "green" });
const setStuff = () => {
chrome.action.setBadgeText({ text: `...` });
}