DEV Community

Furkan Köykıran
Furkan Köykıran

Posted on

CLI-Anything'e Tarayıcı Otomasyon Desteği: MCP Backend Pattern İlk Uygulama

Tarayıcı otomasyonu gerçekten ilginç bir problem. AI ajanlarının web sitelerinde gezinebilmesi, formları doldurabilmesi artık sadece "iyi sahip olmak" değil, zorunluluk. CLI-Anything projesine yaptığım browser support katkısını burada anlatacağım.

MCP Architecture

Issue #90'dan PR #118'e

Her şey 16 Mart 2026'da @apireno'nin #90 numaralı issue'sını açmasıyla başladı. Ana fikir şuydu: "CLI wrapper'lar yazılımı ajan-native yapıyor" ve bunun tarayıcılar için de geçerli olabileceği.

@apireno, DOMShell projesinden bahsetti. DOMShell, Chrome'un Accessibility Tree'sini sanal bir dosya sistemine çeviriyor. Ajanlar ls, cd, grep, click gibi komutlarla tarayıcıyı kontrol edebiliyor. Benchmark sonuçları ilginçti: screenshot tabanlı yaklaşıma göre %50 daha az API çağrısı.

Accessibility Tree

Accessibility Tree Nedir?

Accessibility Tree, tarayıcının DOM'dan ürettiği ama daha sade bir yapı. Ekran okuyucular için var bu yapı. Öğeleri rollerine göre sınıflandırıyor - button, link, textbox gibi. Ajanlar için de ideal aslında, stabil ve anlaşılır.

DOMShell'in mantığı basitti: Filesystem primitives (ls, cd, grep) DOM query'lerden daha verimli. Ajanlar sayfayı gezerken daha az çağrı yapıyor, daha hızlı ulaşıyor hedefe.

21 Mart'ta @omerarslan0'nın önerdiği modeli temel alarak PR'ı oluşturdum. Bu, CLI-Anything'in ilk MCP server backend pattern'idi.

# Kullanım örneği
cli-anything-browser page open https://example.com
cli-anything-browser fs ls /
cli-anything-browser fs cd /main
cli-anything-browser fs grep "Login"
cli-anything-browser act click /main/button[0]
Enter fullscreen mode Exit fullscreen mode

Mimari

Diğer harness'lar genellikle doğrudan backend API çağrısı yapıyor. Bu sefer durum farklıydı: MCP Server entegrasyonu.

MCP Backend Pattern

Bu CLI-Anything için yeni bir patterndi. Öncesinde hiçbir harness MCP server kullanmamıştı. Python SDK implementasyonu:

from mcp import ClientSession, StdioServerParameters
from mcp.client.stdio import stdio_client

server_params = StdioServerParameters(
    command="npx",
    args=["@apireno/domshell"]
)

async with stdio_client(server_params) as (read, write):
    async with ClientSession(read, write) as session:
        await session.initialize()
        result = await session.call_tool("domshell_ls", {"path": "/"})
Enter fullscreen mode Exit fullscreen mode

Ana fark şu: MCP server stateless. Her komutta yeni subprocess başlıyor. State (URL, working directory, history) CLI tarafında tutuluyor.

Command Groups

Implementasyon 4 ana group içeriyordu:

  • page: open, reload, back, forward, info - Sayfa navigasyonu
  • fs: ls, cd, cat, grep, pwd - Dosya sistemi tarzı gezinme
  • act: click, type - Etkileşim
  • session: status, daemon-start, daemon-stop - Oturum yönetimi

Daemon Mode

Her komutta npx subprocess başlatmak 1-3 saniye kaybettiriyor. Daemon mode ile kalıcı bağlantı kuruyorsun. İnteraktif kullanımda fark hissediliyor.

Testler

Üç katmanlı test stratejisi uyguladım. Unit tests 31 taneydi - MCP backend response'ları mock'lanıyor, path resolution ve state management test ediliyordu. Chrome gerekmiyordu.

E2E tests 10 taneydi. Chrome + DOMShell extension gerekiyordu. Gerçek sayfalarda test ediyordu. DOMShell yoksa testler skip oluyordu, böylece CI/CD patlamıyordu.

Review Süreci

PR'ı gönderdikten sonra @omerarslan0 review yaptı. 9 maddelik feedback aldım. En kritikleri:

  • Daemon mode context manager leak - _daemon_client_context global değişkeni ile düzeltildi
  • go_back()/go_forward() - Native MCP tool'ları kullanıldı
  • REPL quoted arguments - shlex.split() ile düzeltildi, tırnaklı argümanlar artık doğru parse ediliyor
  • Security - act type artık typed text'i echo etmiyor, passwordler terminal scrollback'de kalmıyor

Browser CLI Interface

Merge ve Sonuç

22 Mart'ta PR merge edildi. 3,095 satır ekleme, 21 dosya değişti, 15 commit. Bu, CLI-Anything'in ilk MCP backend pattern referans implementasyonu. Gelecekteki MCP entegrasyonları için bir template olacak.

Browser harness CLI-Hub'a eklendi ve artık kullanıma hazır.

Öğrendiklerim

MCP Python SDK

stdio transport ile subprocess communication, async → sync wrapper, tool calling pattern'leri.

Accessibility Tree vs DOM

Accessibility Tree daha stabil. DOM query'lerden daha az kırılgan. Agent navigation için ideal.

Open Source

Issue'dan implementasyona geçiş, review feedback yönetimi, documentation update'leri, test coverage önemi.

Bu katkı sadece bir browser harness değil, aynı zamanda gelecekteki MCP entegrasyonları için bir referans pattern oluşturdu. cli-anything-plugin/HARNESS.md'ye eklenen MCP Backend Pattern bölümü, diğer geliştiricilere rehber olacak.


Referanslar:


Bu yazı DevTo-MCP aracılığıyla DEV.to'ya gönderilmiştir.

Top comments (0)