Content Script Architecture (`content.js`)

This document describes the structure and flow of content.js, which acts as the in-page automation engine for injecting chat messages and monitoring responses in various AI web interfaces.

🧩 Overview

The content script:

Detects which AI platform is active (e.g., ChatGPT, AI Studio).
Loads the appropriate provider.
Sends chat messages programmatically.
Monitors the DOM for typed/streamed responses.
Reports back results to the background script.

⚙️ Initialization

Boot Sequence

Executed on load: initializeContentRelay()
Identifies provider using window.providerUtils
Sends CHAT_RELAY_READY to background
Sets up provider capture and polling logic

sequenceDiagram
    participant ContentScript
    participant Provider
    participant Background

    ContentScript->>Provider: detectProvider()
    ContentScript->>Background: CHAT_RELAY_READY
    ContentScript->>DOM: monitor inputs/buttons
    ContentScript->>DOM: start polling

📌 DOM Utilities

Element detection: findPotentialSelectors()
Polling loop: startElementPolling()

Searches for selectors like:

provider.inputSelector
provider.sendButtonSelector
provider.responseSelector

💬 Message Injection

Method: `sendChatMessage(text)`

Calls sendChatMessageWithRetry()
Retries sending if button/input not ready
Uses provider.sendChatMessage()

📥 Response Capture

A. DOM Monitoring

setupAutomaticResponseCapture(): sets MutationObserver
startMonitoringForResponse(): begins timed attempts
Captures response with captureResponse()

B. Completion Detection

Platform-specific heuristics like:

🔁 Provider Coordination

Uses shared provider object initialized at runtime
Each provider has methods like:
- sendChatMessage()
- getStreamingApiPatterns()
- shouldSkipResponseMonitoring()

🛡️ Fault Recovery

Logs missing selectors or failures
Retries up to 5x for message dispatch
Reports failure back to background

✅ Summary

content.js dynamically adapts to different AI platforms to send and monitor chat activity. It forms the frontend relay bridge between user intent (via server) and provider-specific DOM interfaces.

2.7 KiB Raw Blame History

Content Script Architecture (content.js)