Merge pull request #2 from alexchenzl/bugfix

Bugfix

README.md

@@ -9,15 +9,15 @@ The system architecture is visualized using a mermaid diagram, illustrating the
 
 ```mermaid
 graph TB
-subgraph "Nano Browser Agent"
+subgraph "Nano Browser Agent Server"
 direction LR
 WS[WebSocket Server]
-subgraph "Multi-Agent components"
+subgraph "Multi-Agent Component"
 direction TB
-N[Navigator Agent]
-P[Planner Agent]
-E[Evaluator Agent]
-V[Validator Agent]
+N[Navigator]
+P[Planner]
+E[Evaluator]
+V[Validator]
 end
 end
 subgraph "Chrome Extension"
@@ -49,7 +49,7 @@ linkStyle 2,3,4,5 stroke-width:2
 - Manages bidirectional communication between the Chrome extension and the multi-agent system
 - Relays commands and status updates between components
 
-### Multi-Agent Components
+### Multi-Agent Component
 - **Planner Agent**: Breaks down web navigation tasks into manageable steps
 - **Navigator Agent**: Executes web navigation steps as planned
 - **Evaluator Agent**: Assesses the success of each navigation step and provides feedback for retries (TODO)

extension/src/content.js

@@ -1,31 +1,39 @@
-// Function to generate a fallback ID when tab ID is unavailable
-function generateFallbackId() {
-    return `fallback-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-}
+// Wrap everything in an IIFE to avoid global scope pollution
+(() => {
+    // Only initialize if we haven't already
+    if (window.__nanoTabObserver) {
+        return;
+    }
+
+    // Function to generate a fallback ID when tab ID is unavailable
+    function generateFallbackId() {
+        return `fallback-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+    }
 
-// Function to ensure ID is assigned
-function ensureTabId() {
-    if (!document.body.hasAttribute('data-nano-tab-id')) {
-        // Get tab ID from chrome runtime
-        chrome.runtime.sendMessage({ type: 'GET_TAB_ID' }, (response) => {
-            let uniqueId;
-            if (response?.tabId) {
-                uniqueId = `nano-tab-${response.tabId}`;
-            } else {
-                uniqueId = generateFallbackId();
-                console.warn('Using fallback ID: Tab ID was unavailable');
-            }
-            document.body.setAttribute('data-nano-tab-id', uniqueId);
-        });
+    // Function to ensure ID is assigned
+    function ensureTabId() {
+        if (!document.body.hasAttribute('data-nano-tab-id')) {
+            // Get tab ID from chrome runtime
+            chrome.runtime.sendMessage({ type: 'GET_TAB_ID' }, (response) => {
+                let uniqueId;
+                if (response?.tabId) {
+                    uniqueId = `nano-tab-${response.tabId}`;
+                } else {
+                    uniqueId = generateFallbackId();
+                    console.warn('Using fallback ID: Tab ID was unavailable');
+                }
+                document.body.setAttribute('data-nano-tab-id', uniqueId);
+            });
+        }
+        return document.body.getAttribute('data-nano-tab-id');
     }
-    return document.body.getAttribute('data-nano-tab-id');
-}
 
-// Run immediately when script loads
-ensureTabId();
+    // Run immediately when script loads
+    ensureTabId();
 
-// Handle dynamic page changes
-const observer = new MutationObserver(ensureTabId);
-observer.observe(document.body, {
-    attributes: true
-});
+    // Create observer and store it in a window property to prevent duplicate initialization
+    window.__nanoTabObserver = new MutationObserver(ensureTabId);
+    window.__nanoTabObserver.observe(document.body, {
+        attributes: true
+    });
+})();