I'm making an opera extension and I want to get some images stored inside the extension path.
What the plugin does is, on a specific web page, change the image url from the background and some icons to custom ones inside the extension.
However when I run the script everything become invisible, meaning it failed to load the images.
Inside the logger I see chrome-extension://invalid/ net::ERR_FAILED but when I log the path it seem normal.
Inside the manifest.json file I have the webRequest and storage permissions, also the plugin has permission to read user files I have double checked.
Am I missing a permission that lock me out? Does manifest 3 not allow to change a background image?
I also tried to run the same script on Firefox but everything works are it should.
// get image folder from current plugin path.
let extFolder = chrome.runtime.getURL("images/"); // chrome
//let extFolder = extension.getURL("images/"); // firefox
// should look like: chrome-extension://<id>/images/
console.log(extFolder);
// get element to change.
let board = document.getElementById("board");
// change image.
board.style.backgroundImage = "url('" + extFolder + "board.png')";
The script I've wrote look like this, now why it does not work on opera?
I also tried to embeed these images as base64 but, since each image is very big, not all elements render the image.
Ok, I found what's the problem... is manifest 3.
The reason it works on firefox is because I've used manifest version 2, meanwhile opera uses version 3 instead.