removing the tabs permission and reverting to window.postMessage

Author: Salman Paracha

demos/use_cases/chatgpt-preference-model-selector/public/manifest.json

@@ -1,11 +1,10 @@
 {
   "manifest_version": 3,
-  "name": "RouteGPT (beta)",
-  "version": "0.1.0",
+  "name": "RouteGPT",
+  "version": "0.1.1",
   "description": "RouteGPT: Smart Model Routing for ChatGPT.",
   "permissions": [
-    "storage",
-    "tabs"
+    "storage"
   ],
   "host_permissions": [
     "https://chatgpt.com/*",

demos/use_cases/chatgpt-preference-model-selector/src/components/PreferenceBasedModelSelector.js

@@ -220,11 +220,10 @@ export default function PreferenceBasedModelSelector() {
         console.log('[PBMS] Saved tuples:', tuples);
       }
     });
+    // Send message to background script to apply the default model
+    window.parent.postMessage({ action: 'applyModelSelection', model: defaultModel }, "*");
 
-    chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
-      chrome.tabs.sendMessage(tabs[0].id, { action: 'applyModelSelection', model: defaultModel });
-    });
-
+    // Close the modal after saving
     window.parent.postMessage({ action: 'CLOSE_PBMS_MODAL' }, '*');
   };
 

demos/use_cases/chatgpt-preference-model-selector/src/scripts/content.js

@@ -311,6 +311,7 @@ Based on your analysis, provide your response in the following JSON formats if y
   });
 
   let desiredModel = null;
+
   function patchDom() {
     if (!desiredModel) return;
 
@@ -320,27 +321,42 @@ Based on your analysis, provide your response in the following JSON formats if y
     const span = btn.querySelector('div > span');
     const wantLabel = `Model selector, current model is ${desiredModel}`;
 
-    if (span && span.textContent !== desiredModel) span.textContent = desiredModel;
+    if (span && span.textContent !== desiredModel) {
+      span.textContent = desiredModel;
+    }
+
     if (btn.getAttribute('aria-label') !== wantLabel) {
       btn.setAttribute('aria-label', wantLabel);
     }
   }
 
+  // Observe DOM mutations and reactively patch
   const observer = new MutationObserver(patchDom);
   observer.observe(document.body || document.documentElement, {
-    subtree: true, childList: true, characterData: true, attributes: true
+    subtree: true,
+    childList: true,
+    characterData: true,
+    attributes: true
   });
 
+  // Set initial model from storage (optional default)
   chrome.storage.sync.get(['defaultModel'], ({ defaultModel }) => {
     if (defaultModel) {
       desiredModel = defaultModel;
       patchDom();
     }
   });
 
-  chrome.runtime.onMessage.addListener(msg => {
-    if (msg.action === 'applyModelSelection' && msg.model) {
-      desiredModel = msg.model;
+  // ✅ Only listen for messages from iframe via window.postMessage
+  window.addEventListener('message', (event) => {
+    const data = event.data;
+    if (
+      typeof data === 'object' &&
+      data?.action === 'applyModelSelection' &&
+      typeof data.model === 'string'
+    ) {
+
+      desiredModel = data.model;
       patchDom();
     }
   });