DowncityDevdocs
Chrome Extension

Chrome Extension Architecture

How the extension captures page context and dispatches work to Downcity

Chrome Extension Architecture

products/chrome-extension/ is the browser-side entry point for pushing live web context into an agent.

Responsibilities

  • capture the current page title and URL
  • extract readable content and convert it to Markdown
  • resolve target agent and chat context
  • dispatch execution requests to the Downcity Console gateway

Main Modules

  • src/extension-popup/: Extension Popup UI for direct send flow
  • src/options/: settings page
  • src/services/downcityApi.ts: API boundary for agents, contexts, and task dispatch
  • src/services/pageMarkdown.ts: structured content extraction and Markdown generation
  • src/services/storage.ts: persisted extension preferences
  • src/inline-composer/: Inline Composer interaction layer for selected text flow

Execution Flow

user action
  -> Extension Popup or Inline Composer
    -> capture page / selection context
      -> build Markdown attachment
        -> POST to console gateway
          -> agent context execution

Design Notes

  • Popup and options are React pages
  • The in-page selection panel still relies on a content script, but its style pipeline is aligned with Tailwind output
  • Request dispatch prefers sendBeacon with a keepalive fetch fallback so the Extension Popup can close immediately after enqueue