use static method to inject script

Author: snowystinger

packages/dev/style-macro-chrome-plugin/README.md

@@ -27,6 +27,8 @@ If the panel isn't updating with styles, try closing the dev tools and reopening
 
 If the extension doesn't appear to have the latest code, try closing the dev tools and reopening it.
 
+If every tab you have open (or many of them) reload when you make local changes to the extension, then go into the extension settings and limit it to `localhost` or something appropriate.
+
 ## ToDos
 
 - [ ] Work with RSC

packages/dev/style-macro-chrome-plugin/src/devtool.js

@@ -1,19 +1,4 @@
-let injectScript = () => {
-  chrome.scripting.executeScript({
-    target: {
-      tabId: chrome.devtools.inspectedWindow.tabId,
-      allFrames: true
-    },
-    files: chrome.runtime.getManifest().content_scripts[0].js
-  });
-};
 
-injectScript();
-chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
-  if (tabId === chrome.devtools.inspectedWindow.tabId && changeInfo.status === 'complete' && tab.active) {
-    injectScript();
-  }
-});
 
 chrome.devtools.panels.elements.createSidebarPane('Style Macros', (sidebar) => {
   sidebar.setObject({});

packages/dev/style-macro-chrome-plugin/src/manifest.json

@@ -5,6 +5,8 @@
   "devtools_page": "devtools.html",
   "content_scripts": [{
     "matches": ["*://*/*"],
-    "js": ["content-script.js"]
+    "js": ["content-script.js"],
+    "all_frames": true,
+    "run_at": "document_start"
   }]
 }