En una extensión de Chrome, intento cargar una imagen con un script de contenido usando CSS. La imagen no carga.

Aquí está el manifiesto.json :

 "content_scripts": [ { "matches": ["<all_urls>"], "css": ["content.css"], "js": ["content.js"], "run_at": "document_end", "all_frames": true } ]

Con content.js , agrego un elemento a las páginas que, de hecho, se agrega con éxito cada vez.

Y aquí está el código CSS :

 #my_added_element { background: url('chrome-extension://__MSG_@@extension_id__/icon.png') right center; }

También probé:

 #my_added_element { background: url('chrome-extension://__MSG_@@extension_id__/content/icon.png') right center; }

en caso de que hubiera una restricción sobre la carga de recursos desde otro directorio.

En ambos casos, la secuencia de comandos CSS se inyecta como se esperaba, como puedo confirmar usando las herramientas para desarrolladores, y si hago clic en el enlace CSS de la imagen en las herramientas para desarrolladores, se abre sin problemas en una nueva pestaña.

Entonces, ¿qué impide la carga de la imagen en las páginas? ¿Qué más debo revisar?