DEV Community

dewa kipas
dewa kipas

Posted on

TestSprite MCP Server — Panduan Memulai Lengkap (Bahasa Indonesia)

#testing #indonesia #mcp #tutorial

TestSprite MCP Server — Panduan Memulai (Bahasa Indonesia)

Terjemahan resmi dokumentasi TestSprite ke Bahasa Indonesia. Sumber asli: https://docs.testsprite.com

Daftar Isi

  1. Pengenalan
  2. Gambaran Umum
  3. Instalasi
  4. Tes MCP Pertama Anda

Pengenalan

Mulai dengan TestSprite MCP Server.

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

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

Mulai dari Mana?

Tujuan Langkah
Pelajari cara kerja TestSprite Gambaran Umum
Pasang MCP Server Instalasi
Jalankan tes pertama Tes MCP Pertama
Kelola API Keys Dashboard TestSprite → Settings → API Keys

Gambaran Umum

Apa Itu TestSprite MCP Server?

TestSprite MCP Server adalah integrasi Model Context Protocol yang menghubungkan asisten AI di 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 memasang TestSprite MCP di IDE Anda, gunakan prompt bahasa alami sederhana untuk membiarkan agen pengujian AI kami menangani seluruh alur kerja pengujian.

Cukup ketik perintah berikut, seret folder proyek ke dalam chat, atau deskripsikan kebutuhan pengujian Anda. TestSprite MCP Server mengurus sisanya.

Bantu saya menguji proyek ini dengan TestSprite.
Enter fullscreen mode Exit fullscreen mode

Cara Kerja TestSprite dalam 8 Langkah Sederhana

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

Manfaat Utama

Untuk Developer: Rilis lebih cepat dengan tanpa menulis tes, dapatkan umpan balik dalam menit (bukan jam), dan perbaiki masalah secara otomatis dengan analisis berbasis AI—semuanya tanpa meninggalkan IDE Anda.

Untuk Tim: Capai kualitas yang dapat diprediksi dan rilis lebih cepat dengan cakupan yang luas dan konsisten—termasuk kasus tepi (edge cases)—sambil mengurangi upaya QA manual dan overhead pemeliharaan tes.

Perbandingan dengan Pengujian Tradisional

Fitur Pengujian Tradisional TestSprite MCP Server
Pembuatan kasus uji Menulis kasus uji secara manual AI menghasilkan kasus uji secara otomatis
Setup Menyiapkan framework yang kompleks Hampir tanpa setup
Debugging Men-debug kegagalan secara manual Menganalisis dan memperbaiki masalah untuk Anda
Integrasi Menjalankan tes terpisah dari development Terintegrasi ke dalam alur kerja coding Anda
Cakupan Cakupan terbatas yang melewatkan kasus kritis Cakupan otomatis yang komprehensif

Kemampuan Pengujian

Pengujian Frontend (Business-Flow E2E):

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

Pengujian Backend (API & Integrasi):

  • Alur Kerja API Fungsional
  • Validasi Kontrak & Skema
  • Penanganan Error & Ketahanan
  • Otorisasi & Autentikasi
  • Kasus Batas & Tepi
  • 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

  • 90%+ Kualitas Kode — Capai kualitas kode tingkat profesional
  • 10x Lebih Cepat — Dari jam menjadi menit
  • Zero Learning Curve — Tidak perlu keahlian pengujian
  • Perbaikan Bug Otomatis — AI menambal masalah secara otomatis

Instalasi

Pasang TestSprite MCP Server di IDE Anda dalam waktu kurang dari 2 menit.

Prasyarat

Sebelum memasang TestSprite MCP Server, pastikan Anda memiliki:

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

Untuk memeriksa versi Node.js Anda:

node --version
Enter fullscreen mode Exit fullscreen mode

Dapatkan API Key Anda

Pertama, Anda memerlukan API key TestSprite:

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

Panduan Instalasi per IDE

Cursor

Penting: Mode "Run in Sandbox" default Cursor membatasi fungsionalitas TestSprite. Pastikan untuk mengubah pengaturan Auto-Run Mode ke "Ask Everytime" atau "Run Everything" di Cursor Settings → Chat → Auto-Run.

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 (Cmd/Ctrl + Shift + 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

VS Code

  1. Buka Command Palette (Cmd/Ctrl + Shift + P)
  2. Jalankan perintah MCP: Add Server
  3. Pilih tipe instalasi Command (stdio)
  4. Ketik npx @testsprite/testsprite-mcp@latest untuk Command to run
  5. Ketik TestSprite sebagai nama MCP server
  6. Pilih scope 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

Claude Code

  1. Navigasi ke direktori proyek Anda di terminal: 
cd /path/ke/proyek/anda
Enter fullscreen mode Exit fullscreen mode
  1. Tempelkan perintah instalasi berikut ke terminal: 
claude mcp add TestSprite --env API_KEY=api_key_anda -- npx @testsprite/testsprite-mcp@latest
Enter fullscreen mode Exit fullscreen mode

  1. Ganti api_key_anda dengan API key TestSprite Anda yang sebenarnya.

  2. Verifikasi instalasi:

claude mcp list
Enter fullscreen mode Exit fullscreen mode

Output yang diharapkan:

TestSprite: npx @testsprite/testsprite-mcp@latest - ✓ Connected
Enter fullscreen mode Exit fullscreen mode

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 klik Confirm.
  6. Pilih Builder with MCP dan mulai pengujian.

IDE Lainnya (Windsurf, Antigravity, dll.)

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 Sukses:

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

Tes Cepat — Coba prompt:

Bantu saya menguji proyek ini dengan TestSprite.
Enter fullscreen mode Exit fullscreen mode

Asisten Anda harus menawarkan untuk menggunakan TestSprite MCP tools.

Menghapus Instalasi

Untuk menghapus TestSprite MCP Server:

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

Tes MCP Pertama Anda

Rasakan keajaiban TestSprite MCP Server dengan tes otomatis pertama Anda dalam waktu kurang dari 10 menit.

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

Sebelum memulai, pastikan Anda telah memasang TestSprite MCP Server dan IDE Anda terbuka.

Langkah 1: Persiapkan 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:

proyek-saya/
├── 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: 
Bisakah kamu menguji proyek ini dengan TestSprite?
Enter fullscreen mode Exit fullscreen mode
  1. Seret dan lepas folder proyek Anda ke dalam chat jika Anda ingin menguji sub-proyek tertentu
  2. Tekan Shift + Enter

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

Langkah 3: Konfigurasi (Wajib)

Halaman Konfigurasi Pengujian akan terbuka di browser Anda. Selesaikan setup di sini untuk melanjutkan pengujian.

Saat bootstrap tool terbuka, Anda harus mengkonfigurasi:

1. Tipe Pengujian

Mode Deskripsi
Frontend Pilih ini jika Anda ingin menguji UI dan alur pengguna (tombol, form, navigasi).
Backend Pilih ini jika Anda ingin menguji API, layanan, atau logika server.
Scope Deskripsi
Codebase Menjalankan tes terhadap seluruh proyek. Gunakan ini jika Anda ingin sweep tes penuh.
Code Diff Menjalankan tes hanya terhadap perubahan terbaru Anda (perubahan Git yang belum di-commit).

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

Untuk Frontend:

Username: test@contoh.com
Password: password-tes-anda
Enter fullscreen mode Exit fullscreen mode

Untuk Backend:
| Tipe Autentikasi | Deskripsi |
|-----------------|-----------|
| 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)

Upload PRD yang ada (wajib). Bahkan PRD draf atau berkualitas rendah pun tidak masalah. AI TestSprite akan menghasilkan PRD yang dinormalisasi berdasarkan upload Anda.

Langkah 4: Alur Kerja Otomatis

Asisten AI Anda akan secara otomatis menangani seluruh proses pengujian. Semuanya mulai dari memahami proyek Anda hingga menjalankan tes aktual ditangani secara otomatis—tidak ada pekerjaan manual yang diperlukan.

Langkah 5: Tinjau Hasil Pengujian

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

testsprite_tests/
├── tmp/
│   ├── prd_files/                 # File PRD yang diupload
│   ├── config.json               # Konfigurasi pengujian
│   ├── code_summary.json         # Analisis kode
│   ├── report_prompt.json        # Data analisis AI
│   └── test_results.json         # Hasil pengujian terperinci
├── 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_Berhasil_Dengan_Kredensial_Valid.py
├── TC002_Login_Gagal_Dengan_Kredensial_Invalid.py
└── ...                           # File pengujian tambahan
Enter fullscreen mode Exit fullscreen mode

Memahami Hasil Pengujian — Laporan pengujian menampilkan:

  • Cakupan keseluruhan dan tingkat keberhasilan
  • Pengujian yang gagal dengan analisis kegagalan terperinci
  • Kategori (Fungsional, UI/UX, Keamanan, Performa)

Contoh ringkasan laporan:

{
  "ringkasan": {
    "totalPengujian": 18,
    "berhasil": 12,
    "gagal": 6,
    "tingkatKeberhasilan": "67%",
    "cakupan": "85%"
  },
  "kegagalan": [
    {
      "idPengujian": "TC005",
      "judul": "Akses Panel Admin",
      "error": "Tombol tidak ditemukan: #admin-delete-btn",
      "rekomendasi": "Tambahkan tombol hapus yang hilang di panel admin"
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

Langkah 6: Perbaikan Bug Otomatis

Minta Perbaikan — Setelah meninjau hasil pengujian, cukup tanyakan:

Tolong perbaiki codebase berdasarkan hasil pengujian TestSprite.
Enter fullscreen mode Exit fullscreen mode

AI akan:

  1. Menganalisis pengujian yang gagal
  2. Mengidentifikasi bagian kode yang bermasalah
  3. Menerapkan perbaikan yang ditargetkan secara otomatis
  4. Menjalankan ulang pengujian untuk memverifikasi perbaikan
  5. Mengiterasi hingga masalah terselesaikan

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 Pengujian — Siapkan akun pengguna tes dengan data non-produksi
  • Tinjau File yang Dihasilkan — Periksa PRD dan rencana pengujian yang dihasilkan untuk akurasi

Langkah Selanjutnya

Selamat! Anda telah berhasil menjalankan tes otomatis pertama dengan TestSprite MCP Server.

Diterjemahkan dari dokumentasi resmi TestSprite: https://docs.testsprite.com
Bahasa: Bahasa Indonesia | Penerjemah: sadyanto (AgentHansa)

Top comments (0)