In my extension Bookmark Dial (https://addons.mozilla.org/en-US/firefox/addon/bookmark-dial/), I replace the homepage with a speed dial page(https://github.com/sblask/firefox-bookmark-dial/blob/master/data/dial.html#L7) using a PageMod(https://github.com/sblask/firefox-bookmark-dial/blob/master/index.js#L77). While developing, I was struggling to get a local CSS file loaded. The thing that worked was reading the file manually and send the string(https://github.com/sblask/firefox-bookmark-dial/blob/master/index.js#L73) and replace the content of the style tag(https://github.com/sblask/firefox-bookmark-dial/blob/master/data/dial.js#L109). Now I got a feature request of someone who wants to change the background image. I could obviously do the same thing, read the image manually and send a data URL(this is what I do with the thumbnail images that I currently store in simple storage, but I think it’s what makes it kind of slow).
The question being: is there really no better way? I tried setting the background in the inspector, but url(‘file:////home/sebastian/Desktop/test.jpg’) doesn’t work. The tooltip says “Could not load image” but when I click to open “file:////home/sebastian/Desktop/test.jpg”, Firefox loads it without a problem. Presumably it’s some kind of restriction, but when I can load the file using the file API, I should be able to load in other ways too?