Add browser tools to co ai agent

[wu-changxing]

Problem

The co ai agent currently doesn't have browser capabilities. The browser agent (co browser) has its own dedicated browser tools, but co ai as the primary coding agent should also be able to browse the web — for looking up docs, checking deployed sites, testing frontend changes, etc.

Proposal

Add browser tools (from connectonion.useful_tools.browser_tools) to the co ai agent's tool suite, similar to how the browser agent has them.

Context

The co create --template minimal already scaffolds projects with browser tools included. The main co ai agent should have parity.

[wu-changxing]

🔍 Summary

Add browser tools (BrowserAutomation) to the co ai agent so it can browse the web for docs, check deployed sites, and test frontend changes. The tool is already wired up in agent.py (staged), but the tool prompt file is missing — the agent has the capability but no LLM guidance on how to use it.

📊 Current vs Proposed

CURRENT (committed):
┌──────────────┐
│   co ai      │  Tools: FileTools, bash, plan, todo, skill, ...
│   agent.py   │  ❌ No browser tools
└──────┬───────┘
       │
       ▼
┌──────────────┐
│ prompts/     │  tools/bash.md, tools/edit.md, tools/glob.md, ...
│ tools/*.md   │  ❌ No browserautomation.md
└──────────────┘


PROPOSED (after this issue):
┌──────────────┐
│   co ai      │  Tools: FileTools, bash, plan, todo, skill, ...
│   agent.py   │  ✅ + BrowserAutomation(headless=True)
└──────┬───────┘  ✅ + image_result_formatter plugin
       │
       ▼
┌──────────────┐
│ prompts/     │  tools/bash.md, tools/edit.md, tools/glob.md, ...
│ tools/*.md   │  ✅ + tools/browserautomation.md  (NEW)
└──────────────┘

📁 Files to Change

connectonion/cli/co_ai/
├── agent.py                              ← ALREADY DONE (staged)
│   ├── import BrowserAutomation          ✅
│   ├── browser = BrowserAutomation()     ✅
│   ├── add to tools list                 ✅
│   └── add image_result_formatter plugin ✅
│
├── prompts/
│   └── tools/
│       └── browserautomation.md          ← NEW FILE (main work)
│           Guide LLM on when/how to use
│           browser tools in coding context
│
└── (optional) plugins/system_reminder.py ← MINOR TWEAK
    └── Consider browser context in intent detection

🏗️ Architecture: How Tool Prompts Work

assemble_prompt(tools=[file_tools, browser, bash, ...])
       │
       ▼
For each tool:
  name = _get_tool_name(tool)
  ┌─────────────────────────────┐
  │ BrowserAutomation instance  │
  │ → __class__.__name__        │
  │ → "BrowserAutomation"       │
  │ → .lower() = "browserautom" │
  └────────────┬────────────────┘
               │
               ▼
  Look for: prompts/tools/browserautomation.md
            ↓
  If exists → load, interpolate, append to system prompt
  If missing → ❌ NO guidance (current state)

🔄 Data Flow: Browser in co ai vs co browser

                    co browser                         co ai
                    ──────────                         ─────
Purpose:     Browser-first agent              Coding agent + browser assist
Model:       co/gemini-3-flash-preview        co/claude-opus-4-5
Browser:     Primary tool (only tool)         One of many tools
Headless:    Configurable                     Always headless=True
Prompt:      Full 228-line agent.md           Needs compact browserautomation.md
Plugins:     image_result_formatter           image_result_formatter (added)
             ui_stream                        (not needed for co ai)

📝 Implementation Steps

Step 1: Create browserautomation.md tool prompt (MAIN WORK)

File: connectonion/cli/co_ai/prompts/tools/browserautomation.md

This is a compact version of the browser agent's agent.md, adapted for a coding agent context. Key differences from co browser:

• Shorter (co ai is a coding agent, browser is secondary)
• Focus on coding-relevant use cases: check deployed sites, read docs, verify frontend
• No deep research workflow (co ai has its own task system)
• Remind to always take_screenshot() after navigation
• Remind headless=True (no wait_for_manual_login)
• Include the element finding pattern (LLM selects from indexed list, never generates CSS)

Content outline:

# Browser Tools

You have browser automation tools via BrowserAutomation.
Use these for: checking deployed sites, reading docs, testing frontend, etc.

## When to Use
- User asks to check a website or URL
- Need to verify a deployment
- Need to read online documentation
- Testing frontend changes

## Key Tools
- open_browser() → go_to(url) → take_screenshot()
- click(description), keyboard_type(text)
- get_text(), get_links_from_page()
- scroll(), close()

## Important Rules
1. Always take_screenshot() after navigation to see results
2. Browser is headless — no visible window
3. Element finding: describe elements naturally, system selects from indexed list
4. Close browser when done
5. Don't use for tasks that bash/curl can handle faster

Step 2: Verify agent.py changes (ALREADY DONE)

The following changes are already staged in agent.py:

• from connectonion.useful_tools.browser_tools import BrowserAutomation
• browser = BrowserAutomation(headless=True)
• browser added to tools list
• image_result_formatter added to plugins list

Step 3: Update agent.py docstring header

Update the module docstring (lines 1-32) to mention browser tools in the "Tools included" list.

⚠️ Risks & Considerations

1. Playwright dependency: BrowserAutomation returns a helpful error string if playwright isn't installed ("Browser tools not installed. Run: pip install playwright && playwright install chromium"). This is graceful — no crash.

2. wait_for_manual_login() in headless mode: This tool uses input() which works in CLI mode but NOT in web server mode (co ai without prompt). For now this is acceptable since the browser is headless and manual login isn't typically needed. Future work could integrate with agent.io for web mode.

3. Context window cost: Adding browser tools adds ~20 tool schemas to the system prompt. The auto_compact plugin should handle this, but worth monitoring.

4. No ui_stream plugin: co browser uses ui_stream for live progress updates. co ai doesn't need this since browser is a secondary tool, not the primary workflow.

🧪 Testing Strategy

1. Unit test: Verify create_coding_agent() includes BrowserAutomation in its tools
2. Prompt test: Run python tests/cli/show_co_ai_prompt.py and verify browserautomation.md content appears in assembled prompt
3. Manual test: co ai "take a screenshot of docs.connectonion.com" — should open browser, navigate, screenshot, close
4. Negative test: Verify that without playwright installed, the agent returns a helpful install message rather than crashing

📋 Estimated Scope

• 1 new file: prompts/tools/browserautomation.md (~40-60 lines)
• 1 minor edit: agent.py docstring header (already have the code changes)
• Total: Small, focused change — the heavy lifting (wiring up tools) is already done