kogiQA MCP Web Browser

resmi

Ini adalah peramban web yang memungkinkan agen pengkodean Anda, seperti Claude Code, untuk mengunjungi situs web atas nama Anda dan membantu Anda mengidentifikasi bug atau membuat kasus uji UI.

Apa yang bisa Anda lakukan dengan kogiQA Web Browser MCP?

Minta asisten Anda untuk mengendalikan browser sungguhan melalui bahasa alami—tanpa perlu selektor.

  • Debug masalah gaya — Minta asisten memeriksa halaman dan menjelaskan mengapa elemen meluap atau tidak sejajar, lalu menyarankan perbaikan CSS.
  • Perbaiki error konsol — Minta asisten menavigasi halaman, mengumpulkan error konsol, dan menerapkan perbaikan di kode sumber Anda.
  • Petakan dan dokumentasikan aplikasi Anda — Instruksikan asisten untuk menjelajahi tautan internal dan menghasilkan ringkasan Markdown tentang fitur setiap halaman.
  • Buat tes end-to-end — Minta tes Cypress yang mencakup jalur sukses dan error validasi dari sebuah alur.
  • Jalankan pengujian eksploratori — Biarkan asisten mencoba input kasus tepi pada formulir dan melaporkan perilaku yang rusak atau tidak konsisten.

Dokumentasi

kogiQA MCP Web Browser

Server Model Context Protocol (MCP) yang menyediakan kemampuan otomatisasi browser menggunakan kogiQA. Server ini memungkinkan LLM untuk berinteraksi dengan halaman web melalui bahasa alami, tanpa memerlukan tangkapan layar atau model yang disetel secara visual.

Untuk apa digunakan:

  • Debug masalah gaya pada halaman Anda
  • Perbaiki error konsol secara otomatis.
  • Petakan dan dokumentasikan fungsionalitas aplikasi web Anda
  • Tulis tes end-to-end secara otomatis
  • Otomatiskan pengujian eksplorasi aplikasi Anda

Lihat contoh prompt Usage Examples

kogiQA MCP vs Playwright MCP

Server kogiQA MCP menyediakan browser yang menggabungkan kemampuan algoritma kontrol browser kogiQA. Ini memungkinkan agen untuk berinteraksi dengan halaman tanpa selektor, menghemat waktu dan token.

Instalasi

Instal otomatis:

npx kogiqa-mcp@latest

Claude Code

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

VS Code

Klik salah satu tombol di bawah ini untuk menginstal langsung di VS Code:

Install in VS Code Install in VS Code Insiders

Atau, instal melalui CLI VS Code:

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

Cursor

Install in Cursor

Atau, buka Cursor SettingsMCPAdd new MCP Server dan masukkan perintah npx kogiqa-mcp@latest.

Konfigurasi standar

Untuk klien MCP lainnya, tambahkan berikut ini ke konfigurasi MCP Anda:

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

Contoh Penggunaan

Setelah server dikonfigurasi, cukup bicara dengan agen Anda dalam bahasa alami. Karena kogiQA bebas selektor, Anda menjelaskan apa yang ingin dilakukan — bukan bagaimana menemukan elemennya.

Uji asap alur pengguna

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".

Debug masalah gaya

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.

Perbaiki error konsol

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

Petakan dan dokumentasikan aplikasi Anda

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.

Buat tes end-to-end

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.

Pengujian eksplorasi

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.

Persyaratan

  • Node.js 20 atau lebih baru
  • VS Code, Cursor, Windsurf, Claude Desktop, Goose, Junie, atau klien MCP lainnya