DEV Community

chrysty bella
chrysty bella

Posted on

TestSprite MCP Server — Panduan Memulai (Bahasa Indonesia)

#indonesia #testing #mcp #ai

Panduan Memulai TestSprite MCP Server — Terjemahan Bahasa Indonesia

Dokumentasi resmi: https://docs.testsprite.com

Daftar Isi

  1. Pengenalan
  2. Gambaran Umum
  3. Instalasi
  4. Tes Pertama Anda
  5. Istilah-Istilah Penting
  6. Membuat Tes untuk Proyek Baru

Pengenalan

TestSprite adalah agen pengujian perangkat lunak AI paling mudah digunakan untuk pengujian yang sepenuhnya otonom. AI kami yang tanpa kode menyelesaikan siklus pengujian dalam 10–20 menit, sehingga Anda bisa merilis aplikasi dengan percaya diri tanpa pekerjaan QA manual.

TestSprite MCP Server adalah integrasi Model Context Protocol yang memungkinkan asisten AI di IDE Anda mengorkestrasi seluruh alur kerja TestSprite langsung dari editor.

Gambaran Umum

Apa Itu TestSprite MCP Server?

TestSprite MCP Server menghubungkan asisten AI IDE Anda (seperti Cursor atau Windsurf) dengan mesin pengujian cerdas TestSprite. Ini memungkinkan alur kerja pengujian yang sepenuhnya otomatis langsung di dalam lingkungan pengembangan Anda.

Cara Kerjanya

Setelah menginstal TestSprite MCP di IDE Anda, gunakan perintah bahasa alami sederhana untuk membiarkan agen pengujian AI kami menangani seluruh alur kerja:

Help me test this project with TestSprite.
Enter fullscreen mode Exit fullscreen mode

Asisten Anda akan otomatis melakukan segalanya mulai dari memahami proyek hingga menjalankan tes.

Cara Kerja TestSprite dalam 8 Langkah Sederhana

  1. Membaca PRD Pengguna — Memahami kebutuhan dan tujuan produk Anda
  2. Menganalisis Kode — Memindai struktur proyek, fitur, dan implementasi
  3. Membuat TestSprite PRD — Membuat dokumen kebutuhan produk yang dinormalisasi
  4. Membuat Rencana Tes — Menghasilkan kasus uji komprehensif berdasarkan PRD dan kode
  5. Menghasilkan Kode Tes — Membuat skrip tes yang dapat dijalankan (Playwright, Cypress, dll.)
  6. Menjalankan Tes — Menjalankan tes di lingkungan cloud yang aman
  7. Menyediakan Hasil — Memberikan laporan detail dengan wawasan yang dapat ditindaklanjuti
  8. Mengaktifkan Perbaikan — IDE menggunakan analisis kami untuk menambal masalah secara otomatis

Manfaat Utama

  • Untuk Developer: Rilis lebih cepat dengan nol penulisan tes, dapatkan umpan balik dalam menit (bukan jam), dan perbaiki masalah secara otomatis dengan analisis bertenaga AI — semua tanpa meninggalkan IDE Anda.
  • Untuk Tim: Capai kualitas yang dapat diprediksi dan rilis lebih cepat dengan cakupan yang luas dan konsisten — termasuk edge case — sambil mengurangi upaya QA manual.

Kemampuan Pengujian

Pengujian Frontend (Business-Flow E2E):

  • Navigasi Perjalanan Pengguna
  • Alur & Validasi Formulir
  • Status Visual & Tata Letak
  • Komponen Interaktif & UI Stateful
  • Alur Otorisasi & Auth
  • Penanganan Error (UI)

Pengujian Backend (API & Integrasi):

  • Alur Kerja API Fungsional
  • Validasi Kontrak & Skema
  • Penanganan Error & Ketahanan
  • Otorisasi & Autentikasi
  • Kasus Batas & Edge Case
  • Integritas Data & Persistensi
  • Pengujian Keamanan

Teknologi yang Didukung

Framework Frontend: React, Vue, Angular, Svelte, Next.js, Vite, Vanilla JavaScript/TypeScript

Teknologi Backend: Node.js, Python, Java, Go, Express.js, FastAPI, Spring Boot, REST APIs, GraphQL

Hasil Nyata

  • Kualitas Kode 90%+ — Capai kualitas kode setara profesional
  • Pengujian 10x Lebih Cepat — Dari jam menjadi menit
  • Nol Kurva Belajar — Tidak memerlukan keahlian pengujian
  • Perbaikan Bug Otomatis — AI menambal masalah secara otomatis

Instalasi

Prasyarat

Sebelum menginstal TestSprite MCP Server, pastikan Anda memiliki:

  1. IDE yang Kompatibel — TestSprite mendukung: Trae, Cursor, Claude Code, Windsurf, VS Code, dan GitHub Copilot
  2. Akun TestSprite — Daftar gratis
  3. Node.js >= 22 — Unduh Node.js (diperlukan untuk menjalankan MCP server)

Cara memeriksa versi Node.js: Jalankan node --version di terminal

Dapatkan API Key

  1. Masuk ke TestSprite Dashboard
  2. Navigasi ke API Keys di bawah Settings
  3. Klik "New API Key"
  4. Salin API key Anda (Anda memerlukannya untuk instalasi)

Instalasi Berdasarkan IDE

Trae

  1. Dapatkan API key Anda
  2. Di Trae, navigasi ke AI Sidebar > AI Management
  3. Pilih MCP > Add > Add from Marketplace
  4. Cari TestSprite dan tambahkan ke daftar MCP Anda
  5. Masukkan API key Anda di Trae dan tekan Confirm
  6. Pilih Builder with MCP dan mulai pengujian

Cursor

Penting: Mode "Run in Sandbox" default Cursor membatasi fungsionalitas TestSprite. Lihat konfigurasi di bawah.

Instalasi Satu Klik:

  1. Dapatkan API key Anda
  2. Klik tautan instalasi satu klik
  3. Masukkan API key Anda di Cursor
  4. Mulai pengujian

Instalasi Manual:

  1. Buka Cursor Settings (⌘⇧J)
  2. Navigasi ke Tools & Integration
  3. Klik Add custom MCP
  4. Tambahkan konfigurasi berikut: 
{
  "mcpServers": {
    "TestSprite": {
      "command": "npx",
      "args": ["@testsprite/testsprite-mcp@latest"],
      "env": {
        "API_KEY": "api-key-anda"
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Konfigurasi Cursor Sandbox Mode:

  1. Buka Cursor → Settings → Cursor Settings
  2. Navigasi ke Chat → Auto-Run → Auto-Run Mode
  3. Ubah pengaturan ke "Ask Everytime" atau "Run Everything"

Claude Code 

# 1. Navigasi ke direktori proyek Anda
cd /path/ke/proyek/anda

# 2. Jalankan perintah instalasi
claude mcp add TestSprite --env API_KEY=api_key_anda -- npx @testsprite/testsprite-mcp@latest

# 3. Verifikasi instalasi
claude mcp list
# Output yang diharapkan:
# TestSprite: npx @testsprite/testsprite-mcp@latest - ✓ Connected
Enter fullscreen mode Exit fullscreen mode

Catatan: Menginstal MCP server dengan cara ini menambahkan TestSprite hanya ke Claude Code di direktori proyek saat ini. Untuk proyek lain, tambahkan MCP server lagi.

VS Code

  1. Buka Command Palette (⌘⇧P)
  2. Jalankan perintah MCP: Add Server
  3. Pilih tipe instalasi Command (stdio)
  4. Ketik npx @testsprite/testsprite-mcp@latest untuk Command
  5. Ketik TestSprite untuk nama MCP server
  6. Pilih cakupan konfigurasi
  7. Tambahkan konfigurasi env: 
{
  "servers": {
    "testsprite": {
      "command": "npx",
      "args": ["-y", "@testsprite/testsprite-mcp@latest"],
      "env": {
        "API_KEY": "api-key-anda"
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

IDE Lainnya

Tambahkan konfigurasi ini ke pengaturan MCP Anda:

{
  "mcpServers": {
    "TestSprite": {
      "command": "npx",
      "args": ["@testsprite/testsprite-mcp@latest"],
      "env": {
        "API_KEY": "api-key-anda"
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Verifikasi Instalasi

Indikator Keberhasilan:

  • Asisten AI Anda dapat melihat alat TestSprite MCP
  • Tidak ada error "command not found"
  • Siap untuk mulai menguji proyek Anda

Tes Cepat: Coba prompt:

Help me test this project with TestSprite.
Enter fullscreen mode Exit fullscreen mode

Asisten Anda seharusnya menawarkan untuk menggunakan alat TestSprite MCP.

Penghapusan Instalasi

  1. Hapus konfigurasi dari pengaturan MCP IDE Anda
  2. Restart IDE Anda

Tes Pertama Anda

Di akhir panduan ini, Anda akan telah menjalankan test suite otomatis pertama Anda, melihat AI menghasilkan rencana tes komprehensif, menyaksikan tes berjalan di cloud, menerima laporan tes detail, dan menerapkan perbaikan bug otomatis.

Sebelum mulai, pastikan Anda telah menginstal TestSprite MCP Server dan IDE Anda terbuka.

Langkah 1: Siapkan Proyek Anda

Jalankan Aplikasi Anda — Pastikan aplikasi Anda berjalan secara lokal:

# Untuk aplikasi frontend (contoh)
npm run dev          # Biasanya berjalan di port 3000, 5173, atau 8080

# Untuk aplikasi backend (contoh)
node index.js        # Biasanya berjalan di port 8000, 3001, atau 4000
Enter fullscreen mode Exit fullscreen mode

Contoh struktur proyek:

my-project/
├── frontend/          # React, Vue, Angular, dll.
│   ├── src/
│   ├── package.json
│   └── ...
├── backend/           # Node.js, Python, dll.
│   ├── app.py
│   ├── requirements.txt
│   └── ...
├── README.md
└── package.json
Enter fullscreen mode Exit fullscreen mode

Langkah 2: Perintah Ajaib

Buka Chat IDE Anda dan ikuti langkah-langkah berikut:

  1. Buka jendela chat baru di IDE Anda
  2. Ketik perintah ajaib: 
Can you test this project with TestSprite?
Enter fullscreen mode Exit fullscreen mode
  1. Seret dan lepas folder proyek Anda ke chat jika ingin menguji sub-proyek tertentu
  2. Tekan ⇧ Enter

Selesai! Asisten AI Anda sekarang akan mengambil alih dan memandu Anda melalui seluruh proses pengujian.

Langkah 3: Konfigurasi (Wajib)

Saat halaman Konfigurasi Pengujian terbuka di browser, konfigurasikan:

1. Tipe Pengujian:

Mode Deskripsi
Frontend Pilih ini untuk menguji UI dan alur pengguna (tombol, formulir, navigasi)
Backend Pilih ini untuk menguji API, layanan, atau logika server
Scope Deskripsi
Codebase Menjalankan tes terhadap seluruh proyek. Gunakan untuk sweep tes penuh
Code Diff Menjalankan tes hanya terhadap perubahan terbaru (git uncommitted). Gunakan untuk validasi cepat

2. Kredensial Akun Tes — Jika aplikasi Anda memerlukan login:

Contoh Frontend:

Username: test@example.com
Password: kata-sandi-tes-anda
Enter fullscreen mode Exit fullscreen mode

Tipe autentikasi Backend:

  • Basic — Menggunakan username & password
  • Bearer — Autentikasi berbasis token yang aman
  • API-key — Menggunakan API key unik untuk akses
  • None — Tidak diperlukan autentikasi

3. URL Aplikasi:

Frontend: http://localhost:5173
Backend:  http://localhost:4000
Enter fullscreen mode Exit fullscreen mode

4. Product Requirements Document (PRD) — Unggah PRD yang ada (wajib). Bahkan draft atau PRD berkualitas rendah pun tidak masalah. AI TestSprite akan menghasilkan PRD yang dinormalisasi berdasarkan unggahan Anda.

Langkah 4: Alur Kerja Otomatis

Asisten AI Anda akan secara otomatis menangani seluruh proses pengujian dengan menjalankan langkah-langkah ini. Semuanya ditangani secara otomatis mulai dari memahami proyek hingga menjalankan tes yang sebenarnya.

Langkah 5: Tinjau Hasil Tes

Setelah pengujian, Anda akan menemukan file-file ini di proyek Anda:

testsprite_tests/
├── tmp/
│   ├── prd_files/                 # File PRD yang diunggah
│   ├── config.json                # Konfigurasi tes
│   ├── code_summary.json          # Analisis kode
│   ├── report_prompt.json         # Data analisis AI
│   └── test_results.json          # Hasil tes detail
├── standard_prd.json              # PRD yang dinormalisasi
├── TestSprite_MCP_Test_Report.md  # Laporan yang dapat dibaca manusia
├── TestSprite_MCP_Test_Report.html # Laporan HTML
├── TC001_Login_Success_with_Valid_Credentials.py
├── TC002_Login_Failure_with_Invalid_Credentials.py
└── ...                            # File tes tambahan
Enter fullscreen mode Exit fullscreen mode

Memahami Hasil Tes: Laporan tes menunjukkan cakupan keseluruhan, tingkat kelulusan, tes yang gagal dengan analisis kegagalan detail, dan kategori (Fungsional, UI/UX, Keamanan, Performa).

Langkah 6: Perbaikan Bug Otomatis

Minta Perbaikan — Setelah meninjau hasil tes, cukup tanyakan:

Please fix the codebase based on TestSprite testing results.
Enter fullscreen mode Exit fullscreen mode

AI akan menganalisis tes yang gagal, mengidentifikasi bagian kode yang bermasalah, menerapkan perbaikan secara otomatis, menjalankan ulang tes untuk memverifikasi perbaikan, dan mengulang hingga masalah terselesaikan.

Contoh Output

Rencana Tes yang Dihasilkan:

{
  "testCases": [
    {
      "id": "TC001",
      "title": "User Authentication Login",
      "description": "Test user login with valid credentials",
      "category": "Functional",
      "priority": "High",
      "steps": [
        "Navigate to login page",
        "Enter valid username and password",
        "Click login button",
        "Verify successful login"
      ]
    }
    // ... 17 kasus uji lainnya
  ]
}
Enter fullscreen mode Exit fullscreen mode

Ringkasan Laporan Tes:

{
  "summary": {
    "totalTests": 18,
    "passed": 12,
    "failed": 6,
    "passRate": "67%",
    "coverage": "85%"
  },
  "failures": [
    {
      "testId": "TC005",
      "title": "Admin Panel Access",
      "error": "Button not found: #admin-delete-btn",
      "recommendation": "Add missing delete button in admin panel"
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

Tips untuk Sukses

  • Pastikan Aplikasi Berjalan: Frontend dan backend harus dapat diakses di port standar
  • Struktur Proyek: Sertakan README dengan instruksi setup dan nama folder yang deskriptif
  • Kredensial Tes: Siapkan akun pengguna tes dengan data non-produksi
  • Tinjau File yang Dihasilkan: Periksa PRD dan rencana tes yang dihasilkan untuk akurasi

Istilah-Istilah Penting

Generate & Regenerate

Tindakan ini mengontrol cara TestSprite membuat dan memperbarui test suite Anda.

Generate — Membuat tes untuk pertama kali berdasarkan PRD dan proyek Anda.

Kapan menggunakan Generate:

  • Memulai proyek baru
  • Menambahkan tes ke proyek yang sudah ada tanpa tes
  • Membuat cakupan tes awal

Prompt contoh:

Help me test this project with TestSprite.
Enter fullscreen mode Exit fullscreen mode

Regenerate — Membuat ulang tes dari awal berdasarkan PRD dan kode yang diperbarui.

Kapan menggunakan Regenerate:

  • Aplikasi Anda berubah secara signifikan (fitur baru, alur yang di-refactor)
  • Rencana tes perlu diperbarui untuk memenuhi persyaratan baru
  • Anda ingin cakupan tes segar yang mencerminkan keadaan saat ini

Prompt contoh:

Regenerate tests for the updated checkout flow.
Enter fullscreen mode Exit fullscreen mode

Run & Rerun

Run — Menjalankan tes yang baru dihasilkan untuk pertama kali.

Kapan menggunakan Run:

  • Setelah menghasilkan tes
  • Validasi awal aplikasi Anda
  • Eksekusi tes pertama kali

Rerun — Menjalankan tes yang sebelumnya dihasilkan lagi tanpa mengubahnya.

Kapan menggunakan Rerun:

  • Memvalidasi perbaikan yang baru saja Anda terapkan
  • Mengkonfirmasi tes lulus setelah restart aplikasi
  • Pemeriksaan asap cepat dengan tes yang ada

Prompt contoh:

Rerun the login and checkout tests with TestSprite.
Enter fullscreen mode Exit fullscreen mode

Healing (Penyembuhan)

Perbaikan otomatis atau semi-otomatis pada tes yang rapuh yang gagal akibat perubahan non-fungsional (bukan bug nyata), membuat tes menjadi tangguh tanpa menutupi masalah produk yang sebenarnya.

Skenario healing yang umum:

  • UI Selector: Memperbarui saat ID/class elemen berubah (mis. #login-btn → [data-testid="login"])
  • Masalah Timing: Menyesuaikan penundaan untuk komponen yang lambat dimuat atau animasi
  • Data Tes: Memperbarui fixture saat skema data berubah
  • Lingkungan: Mengoreksi ketidakcocokan port, kredensial yang hilang, atau masalah konfigurasi
  • Kontrak API: Memperketat pernyataan skema agar sesuai dengan respons API aktual

Cara kerjanya:

  1. Deteksi: TestSprite mengidentifikasi kerapuhan tes (bukan bug produk)
  2. Klasifikasi: Menentukan apakah ini adalah pergeseran selector, ketidakcocokan timing, masalah env, atau pelanggaran kontrak
  3. Usulkan Perbaikan: Menghasilkan perbaikan yang aman
  4. Terapkan: Diterapkan secara otomatis jika risiko rendah, atau meminta persetujuan untuk perubahan besar
  5. Verifikasi: Menjalankan ulang tes untuk memvalidasi perbaikan berhasil

Contoh:

Test failed: Login button selector outdated
Healing: Updated selector from #login-btn to [data-testid="login"]
Status: Auto-applied, test now passing
Enter fullscreen mode Exit fullscreen mode
Apa yang BUKAN Healing Apa yang Merupakan Healing
❌ Menutupi bug produk nyata ✅ Membuat tes tangguh terhadap perubahan kode non-fungsional
❌ Membuat tes lulus saat seharusnya gagal ✅ Mengurangi pekerjaan maintenance tes yang membosankan

Test Scope (Cakupan Tes)

Mendefinisikan bagian mana dari codebase yang akan dianalisis dan diuji oleh TestSprite.

Fitur Codebase Code Diff
Apa yang diuji Menguji seluruh proyek Menguji hanya file/fitur yang berubah (berdasarkan git diff)
Kasus penggunaan Proyek baru, rilis besar, audit komprehensif Branch fitur, pengembangan inkremental, validasi cepat
Kecepatan Lebih lama Umpan balik cepat
Cakupan Cakupan penuh Hanya perubahan terbaru

PRD & Normalized PRD

PRD (Product Requirements Document) — Dokumentasi asli Anda yang mendeskripsikan apa yang harus dilakukan produk Anda.

Bisa berupa:

  • Catatan informal atau README
  • Dokumen spesifikasi formal
  • Tiket Jira atau user story
  • Dokumen desain atau wiki

Normalized PRD — Format PRD standar TestSprite yang memastikan pembuatan tes yang konsisten dan lancar terlepas dari gaya PRD asli Anda.

Isi Normalized PRD:

  • Gambaran umum dan tujuan produk
  • Fitur inti dengan kriteria penerimaan
  • Alur pengguna dan aturan validasi
  • Konteks teknis dari analisis kode

TestSprite menciptakan format ini untuk membuat pembuatan tes dapat diprediksi di seluruh jenis proyek.

Test Plan (Rencana Tes)

Daftar terstruktur dari kasus uji yang dihasilkan oleh TestSprite berdasarkan Normalized PRD dan analisis kode Anda.

Contoh entri rencana tes:

{
  "id": "TC001",
  "title": "Login with valid credentials",
  "category": "functional",
  "priority": "High",
  "steps": [
    "Navigate to login page",
    "Enter valid username and password",
    "Click login button",
    "Verify redirect to dashboard"
  ]
}
Enter fullscreen mode Exit fullscreen mode

Rencana tes biasanya mencakup:

  • ID kasus uji (TC001, TC002, dst.)
  • Deskripsi dan langkah-langkah
  • Kategori (fungsional, keamanan, UI, dll.)
  • Prioritas (Tinggi, Sedang, Rendah)
  • Hasil yang diharapkan

Rencana disimpan sebagai frontend_test_plan.json atau backend_test_plan.json.

Membuat Tes untuk Proyek Baru

Kapan Menggunakan Ini

Gunakan panduan ini saat melakukan onboarding proyek yang memiliki sedikit atau tidak ada tes otomatis. Alur kerja MCP akan menganalisis codebase Anda, menurunkan Normalized PRD, menghasilkan rencana tes frontend dan backend, membuat tes yang dapat dijalankan, menjalankannya, dan menghasilkan laporan.

Prasyarat

  • TestSprite MCP telah diinstal dan dikonfigurasi di IDE Anda
  • Aplikasi dapat berjalan secara lokal (server dev frontend atau API backend)
  • Kredensial tes dasar jika autentikasi diperlukan

Quick Start

Tanyakan asisten IDE Anda:

Help me test this project with TestSprite.
Enter fullscreen mode Exit fullscreen mode

Asisten akan mengorkestrasi alur kerja penuh secara otomatis.

Alur Kerja Pengujian Lengkap

TestSprite mengikuti proses sistematis 8 langkah untuk mengubah kode Anda menjadi perangkat lunak yang diuji secara menyeluruh:

Bootstrap Lingkungan → Baca PRD Pengguna → Analisis Kode
        ↓                      ↓                  ↓
    (Keduanya bergabung) → Hasilkan TestSprite PRD
                                  ↓
                          Buat Rencana Tes
                                  ↓
                         Hasilkan Kode Tes
                                  ↓
                           Jalankan Tes
                                  ↓
                       Hasil & Analisis
                                  ↓
                        AI Perbaiki Masalah
Enter fullscreen mode Exit fullscreen mode

Langkah 1: Bootstrap Lingkungan Pengujian

AI memanggil testsprite_bootstrap_tests untuk menginisialisasi lingkungan pengujian.

Proses:

  1. Deteksi Proyek: Mengidentifikasi tipe proyek (frontend atau backend)
  2. Penemuan Port: Menemukan aplikasi yang berjalan dan portnya
  3. Portal Konfigurasi: Membuka antarmuka konfigurasi TestSprite
  4. Definisi Scope: Menentukan cakupan pengujian (codebase untuk proyek penuh) 
testsprite_bootstrap_tests({
  localPort: 5173,          // atau port Anda
  type: "frontend",         // atau "backend"
  projectPath: "/path/absolut/ke/proyek/anda",
  testScope: "codebase"     // uji seluruh proyek
})
Enter fullscreen mode Exit fullscreen mode

Langkah 2: Baca PRD Pengguna

TestSprite membaca PRD yang Anda unggah untuk memahami tujuan dan persyaratan produk Anda.

Langkah 3: Analisis Kode

TestSprite memindai codebase Anda untuk memahami struktur dan fungsionalitas.

Langkah 4: Hasilkan Normalized PRD

TestSprite menggabungkan PRD Anda dengan wawasan kode untuk membuat dokumen persyaratan yang dinormalisasi.

Langkah 5: Buat Rencana Tes

AI menghasilkan kasus uji komprehensif yang mencakup semua fitur dan alur kritis.

Langkah 6: Hasilkan Kode Tes

TestSprite membuat skrip tes yang dapat dieksekusi.

Langkah 7: Jalankan Tes

Tes dijalankan di lingkungan cloud yang aman dan terisolasi.

Langkah 8: Hasil & Perbaikan Otomatis

Laporan detail dihasilkan, dan AI dapat secara otomatis menambal masalah yang ditemukan.

Tautan Berguna

Diterjemahkan ke Bahasa Indonesia oleh kicau mania (chrysty_bella_) — Mei 2026

Sumber asli: https://docs.testsprite.com

Top comments (0)