Fix for iframe css injection

src/css/inject-style.ts

@@ -2,8 +2,10 @@ import * as postcss from 'postcss';
 import { appendImportantToDeclarations } from './declaration';
 import { getCssWithExpandedImports } from './import';
 
-const getStylesheetId = (id: string) => {
-  return `stylebot-css-${id}`;
+const getStylesheetId = (id: string, iframeIdx?: number) => {
+  return iframeIdx !== undefined
+    ? `stylebot-css-${id}-iframe-${iframeIdx}`
+    : `stylebot-css-${id}`;
 };
 
 export const injectCSSIntoDocument = async (
@@ -12,6 +14,24 @@ export const injectCSSIntoDocument = async (
 ): Promise<void> => {
   const cssWithExpandedImports = await getCssWithExpandedImports(css);
 
+  // inject CSS into all iframes
+  const iframeElems = document.getElementsByTagName('iframe');
+  for (const [iframeIdx, iframeElem] of Array.from(iframeElems).entries()) {
+    const iframeStylesheetId = getStylesheetId(id, iframeIdx);
+    const el = document.getElementById(iframeStylesheetId);
+    if (el) {
+      el.innerHTML = cssWithExpandedImports;
+      return;
+    }
+    const iframeDoc = (iframeElem as any).contentWindow.document;
+    const iframeStyle = iframeDoc.createElement('style');
+    iframeStyle.type = 'text/css';
+    iframeStyle.setAttribute('id', iframeStylesheetId);
+    iframeStyle.appendChild(iframeDoc.createTextNode(cssWithExpandedImports));
+    iframeDoc.head.appendChild(iframeStyle);
+  }
+
+  // then inject CSS into top document
   const stylesheetId = getStylesheetId(id);
   const el = document.getElementById(stylesheetId);
 

src/inject-css/index.ts

@@ -44,18 +44,12 @@ const injectCss = (
 };
 
 const run = () => {
-  if (window === window.top) {
-    injectCss({
-      name: 'GetStylesForPage',
-      important: true,
-    });
-  } else {
-    injectCss({
-      name: 'GetStylesForIframe',
-      url: window.location.href,
-      important: true,
-    });
-  }
+  injectCss({
+    name: 'GetStylesForPage',
+    important: true,
+  });
 };
 
-run();
+document.addEventListener('DOMContentLoaded', () => {
+  run();
+});