chrome.scripting and allFrames: true

[Laurence Lewis]

The extension I am developing works in web pages, but when the webpage has an embedded iframe, the JS and CSS are not injected. I want the extension to run inside a Salesforce development window. I also notice it does not run inside a Codeine frame either.

I thought that using allFrames: true would fix this, however it makes no difference.

Guidance on this appreciated.

try {
            await chrome.scripting.insertCSS({
                target: { tabId: tab.id, allFrames: true },
                files: ["css/styles.css"],
            });
        } catch (err) {
            console.error(`failed to insert roles CSS: ${err}`);
        }

Thanks

Laurence

[Deco]

IFrames cannot be injected from a chrome extension through CSS elements - it is expressly forbidden due to CORS restrictions with cross domain hosts. AllFrames will not work for this approach, your only options are to use PostMessage() within JS or inject via the shadow DOM element: https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM

Thanks,

Decklin

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/e622bd35-b546-43b5-88d1-2be72f837d03n%40chromium.org.

[wOxxOm]

chrome.scripting.insertCSS with allFrames:true is the correct solution here.

If it doesn't work it's either because of a bug in Chrome or your CSS isn't overriding the selectors inside the iframe. Use devtools to inspect the elements and see whether your selectors are added but crossed out, in which case you can use various specificity raising hacks starting with adding `!important` to each property.

[Laurence Lewis]

This is working now in Salesforce :-) Deleting and reinstalling the extension worked.