kogiQA MCP Web Browser

resmi

Bu, Claude Code gibi kodlama aracınızın sizin adınıza web sitelerini ziyaret etmesini ve hata tespiti veya UI test senaryoları oluşturmanıza yardımcı olmasını sağlayan bir web tarayıcısıdır.

GitHub
144

Kogi QA Web Browser MCP ile neler yapabilirsiniz?

  • Stil sorunlarını hata ayıklama — Aracıdan belirli bir görüntü alanı genişliğinde bir sayfayı incelemesini, düzen sorunlarını belirlemesini ve CSS düzeltmeleri önermesini isteyin.
  • Konsol hatalarını otomatik olarak düzeltme — Aracıdan bir menüden bağlantılı tüm sayfalarda gezinmesini, konsol hatalarını toplamasını ve kaynak kodda düzeltmeler uygulamasını isteyin.
  • Web uygulaması işlevselliğini haritalama ve belgeleme — Aracıya belirli bir derinliğe kadar iç bağlantıları taramasını ve her sayfayı ve özelliklerini açıklayan bir Markdown belgesi oluşturmasını talimat verin.
  • Uçtan uca testler oluşturma — Bir kullanıcı akışını (örneğin, kaydolma) tanımlayın ve aracıdan bu akışı izlemesini ve mutlu yol ile doğrulama hatalarını kapsayan Cypress testleri çıktısı vermesini isteyin.
  • Keşif testi gerçekleştirme — Her formda uç durum girdileriyle zaman sınırlı keşif testi yapılmasını ve bozuk veya tutarsız olan her şeyin raporunu isteyin.

Dokümantasyon

kogiQA MCP Web Browser

kogiQA kullanarak tarayıcı otomasyon yetenekleri sağlayan bir Model Bağlam Protokolü (MCP) sunucusu. Bu sunucu, LLM'lerin ekran görüntülerine veya görsel olarak ayarlanmış modellere ihtiyaç duymadan doğal dil aracılığıyla web sayfalarıyla etkileşime girmesini sağlar.

Kullanım amaçları:

  • Sayfanızdaki stil sorunlarını ayıklama
  • Konsol hatalarını otomatik olarak düzeltme.
  • Web uygulamanızın işlevselliğini haritalama ve belgeleme
  • Uçtan uca testleri otomatik olarak yazma
  • Uygulamanızın keşif testlerini otomatikleştirme

Örnek istemlere bakın Kullanım Örnekleri

kogiQA MCP ve Playwright MCP Karşılaştırması

kogiQA MCP Sunucusu, kogiQA tarayıcı kontrol algoritmasının yeteneklerini içeren bir tarayıcı sağlar. Bu, aracıların seçici olmadan sayfalarla etkileşime girmesini sağlayarak zaman ve token tasarrufu yapar.

Kurulum

Otomatik kurulum:

npx kogiqa-mcp@latest

Claude Code

claude mcp add kogiqa-browser npx kogiqa-mcp@latest

VS Code

Doğrudan VS Code'a yüklemek için aşağıdaki düğmelerden birine tıklayın:

Install in VS Code Install in VS Code Insiders

Alternatif olarak, VS Code CLI aracılığıyla yükleyin:

code --add-mcp '{"name":"kogiqa-browser","command":"npx","args":["kogiqa-mcp@latest"]}'

Cursor

Install in Cursor

Alternatif olarak, Cursor Settings → MCP → Add new MCP Server adımlarını izleyin ve npx kogiqa-mcp@latest komutunu girin.

Standart yapılandırma

Diğer tüm MCP istemcileri için, MCP yapılandırmanıza aşağıdakini ekleyin:

{ "mcpServers": { "kogiqa-browser": { "command": "npx", "args": [ "kogiqa-mcp@latest" ] } } }

Kullanım Örnekleri

Sunucu yapılandırıldıktan sonra, aracınızla doğal dilde konuşmanız yeterlidir. kogiQA seçicisiz olduğu için, öğeleri nasıl bulacağınızı değil, ne yapılmasını istediğinizi tanımlarsınız.

Bir kullanıcı akışını duman testi yapma

Open http://localhost:3000, log in with the demo credentials, add the first product to the cart, and verify that the cart badge shows "1".

Bir stil sorununu ayıklama

Go to https://myapp.example.com/pricing and check why the "Pro" plan card overflows its container on a 1280px-wide viewport. Suggest a CSS fix.

Konsol hatalarını düzeltme

Navigate to http://localhost:5173, open every page linked from the main menu, collect all console errors, and fix them in the source code.

Uygulamanızı haritalama ve belgeleme

Explore https://staging.example.com, follow all internal links up to two levels deep, and produce a Markdown document describing each page and its main features.

Uçtan uca testler oluşturma

Walk through the sign-up flow at http://localhost:3000/signup and write Cypress end-to-end tests covering the happy path and validation errors.

Keşif testi

Do 10 minutes of exploratory testing on http://localhost:8080: try edge-case inputs in every form you find and report anything that looks broken or inconsistent.

Gereksinimler

  • Node.js 20 veya daha yenisi
  • VS Code, Cursor, Windsurf, Claude Desktop, Goose, Junie veya başka bir MCP istemcisi