I'm creating a button in javascript and appending it to a HTML page
let dropDownButton = document.createElement('button');
dropDownButton.style.background = "url(/48.png)";
dropDownButton.style.width = size+"px";
dropDownButton.style.height = size+"px";
given.append(dropDownButton);
With 48.png being the local file I wanted to embed.
Currently, this code works in an HTML page I declared (created and declared in manifest) but it doesn't work on a webpage (example twitter, with the last empty button being the one I appended).
Why is this happening? Can I fix it or just go back to inserting a img element inside a button?
Wait I fixed it.
Simply hardcode the chrome.runtime.getURL method to get local file into the syntax of url()
So instead of
dropDownButton.style.background = "url(48.png)";
use
dropDownButton.style.background = "url("+chrome.runtime.getURL('48.png')+")";
