DEV Community

botetnibos02-creator
botetnibos02-creator

Posted on

TestSprite MCP Server — Panduan Lengkap dalam Bahasa Indonesia (Terjemahan Resmi Docs)

#testing #indonesia #javascript #tutorial

TestSprite MCP Server — Panduan Lengkap dalam Bahasa Indonesia

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

Halaman yang diterjemahkan: Introduction · Overview · Installation · First MCP Test

Catatan terjemahan: Nama perintah, nama variabel, code blocks, dan nama fungsi tetap dalam Bahasa Inggris sesuai konvensi teknis.

Pengantar

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

TestSprite MCP Server adalah integrasi Model Context Protocol — standar open-source untuk menghubungkan aplikasi AI ke sistem eksternal — yang memungkinkan asisten AI di IDE Anda mengatur seluruh alur kerja TestSprite langsung dari editor Anda.

Ikhtisar: Apa itu TestSprite MCP Server?

TestSprite MCP Server 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 menginstal TestSprite MCP di IDE Anda, Anda bisa menggunakan perintah bahasa alami sederhana untuk membiarkan agen pengujian AI kami menangani seluruh alur kerja pengujian.

Cukup ketik:

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

TestSprite MCP Server akan menangani sisanya — secara otomatis membaca PRD, menganalisis kode, membuat rencana pengujian, mengeksekusi tes, dan memberikan laporan terperinci.

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. Membuat TestSprite PRD — Membuat dokumen persyaratan produk yang dinormalisasi
  4. Membuat Rencana Pengujian — Menghasilkan kasus uji komprehensif berdasarkan PRD dan kode
  5. Menghasilkan Kode Pengujian — Membuat skrip pengujian yang dapat dieksekusi (Playwright, Cypress, dll.)
  6. Mengeksekusi Pengujian — Menjalankan tes di lingkungan cloud yang aman
  7. Memberikan Hasil — Menyampaikan laporan terperinci dengan wawasan yang dapat ditindaklanjuti
  8. Memungkinkan Perbaikan — IDE menggunakan analisis kami untuk secara otomatis memperbaiki masalah

Manfaat Utama

Untuk Developer:

  • Rilis lebih cepat dengan tanpa menulis tes
  • Dapatkan umpan balik dalam hitungan menit (bukan jam)
  • Perbaiki masalah secara otomatis dengan analisis bertenaga AI
  • Semua ini tanpa meninggalkan IDE Anda

Untuk Tim:

  • Capai kualitas yang dapat diprediksi dan rilis yang lebih cepat
  • Cakupan yang luas dan konsisten — termasuk kasus tepi
  • Kurangi upaya QA manual dan overhead pemeliharaan tes

Perbandingan: Pengujian Tradisional vs TestSprite MCP Server

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 tidak ada setup yang diperlukan
Debugging Men-debug kegagalan secara manual Menganalisis dan memperbaiki masalah untuk Anda
Integrasi Menjalankan tes terpisah dari pengembangan Terintegrasi ke dalam alur kerja pengkodean Anda
Cakupan Cakupan terbatas yang melewatkan kasus tepi kritis Cakupan otomatis komprehensif

Kemampuan Pengujian

TestSprite MCP Server mendukung pengujian komprehensif untuk aplikasi frontend dan backend:

Pengujian Frontend (Business-Flow E2E):

  • Navigasi Perjalanan Pengguna
  • Alur & Validasi Form
  • 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

Hasil Nyata

TestSprite MCP Server memberikan peningkatan yang terukur:

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

Instalasi

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

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 mengecek versi Node.js Anda:

node --version
# Output yang diharapkan: v22.x.x atau lebih tinggi
Enter fullscreen mode Exit fullscreen mode

Dapatkan API Key Anda

Pertama, Anda memerlukan API key TestSprite:

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

Metode Instalasi per IDE

Cursor

Opsi 1 — Instalasi Satu Klik:

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

Opsi 2 — 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

Penting untuk pengguna Cursor: Mode "Run in Sandbox" default Cursor membatasi fungsionalitas TestSprite. Pergi ke Cursor → Settings → Cursor Settings → Chat → Auto-Run → Auto-Run Mode dan ubah ke "Ask Everytime" atau "Run Everything".

Claude Code

  1. Navigasi ke direktori proyek Anda di terminal: 
cd /path/ke/proyek-anda
Enter fullscreen mode Exit fullscreen mode
  1. Tempel perintah instalasi ke terminal Anda: 
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 dengan menjalankan perintah ini:

claude mcp list
Enter fullscreen mode Exit fullscreen mode

Anda akan melihat:

TestSprite: npx @testsprite/testsprite-mcp@latest - ✓ Connected
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 perintah yang akan dijalankan
  5. Ketik TestSprite untuk nama server MCP
  6. 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 (Konfigurasi Universal)

Tambahkan konfigurasi ini ke pengaturan MCP IDE 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 alat TestSprite MCP
  • Tidak ada error "command not found"
  • Siap untuk mulai menguji proyek Anda

Tes Cepat — Coba prompt ini:

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

Asisten Anda seharusnya menawarkan untuk menggunakan alat TestSprite MCP.

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 Anda, melihat AI menghasilkan rencana pengujian komprehensif, menyaksikan tes dieksekusi di cloud, menerima laporan tes terperinci, dan menerapkan perbaikan bug otomatis.

Langkah 1: Siapkan Proyek Anda

Jalankan Aplikasi Anda — Pastikan aplikasi Anda berjalan secara lokal:

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

# Untuk aplikasi backend
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: 
Can you test this project with TestSprite?
Enter fullscreen mode Exit fullscreen mode
  1. Seret dan lepaskan 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)

Saat alat bootstrap terbuka, Anda harus mengonfigurasi:

1. Tipe Pengujian:

  • Frontend: Pilih ini jika Anda ingin menguji UI dan alur pengguna (misalnya tombol, form, navigasi)
  • Backend: Pilih ini jika Anda ingin menguji API, layanan, atau logika server

Cakupan Pengujian:

  • Codebase: Menjalankan tes terhadap seluruh proyek. Gunakan ini jika Anda ingin pemeriksaan tes penuh
  • Code Diff: Menjalankan tes hanya terhadap perubahan terbaru Anda (perubahan Git yang belum di-commit). Gunakan ini untuk memvalidasi pekerjaan baru dengan cepat

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

Untuk Frontend:

Username: test@example.com
Password: kata-sandi-pengujian-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. Dokumen Persyaratan Produk (PRD) — Unggah PRD yang ada (wajib). Bahkan draf 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 — dari memahami proyek hingga menjalankan tes aktual. Anda tidak perlu melakukan pekerjaan apa pun secara manual.

Langkah 5: Tinjau Hasil Pengujian

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

testsprite_tests/
├── tmp/
│   ├── prd_files/                 # File PRD yang diunggah
│   ├── 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_Success_with_Valid_Credentials.py
├── TC002_Login_Failure_with_Invalid_Credentials.py
└── ...                            # File pengujian tambahan
Enter fullscreen mode Exit fullscreen mode

Memahami Hasil Pengujian — Laporan pengujian menampilkan cakupan keseluruhan, tingkat kelulusan, tes yang gagal dengan analisis kegagalan terperinci, dan kategori (Fungsional, UI/UX, Keamanan, Performa).

Contoh Ringkasan Laporan:

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

Langkah 6: Perbaikan Bug Otomatis

Minta Perbaikan — Setelah meninjau hasil pengujian, 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 yang ditargetkan secara otomatis, menjalankan ulang tes untuk memverifikasi perbaikan, dan melakukan iterasi hingga masalah teratasi.

Tips untuk Developer Indonesia

Berdasarkan pengalaman menggunakan TestSprite untuk proyek e-commerce Indonesia:

  1. Aktifkan Cakupan Auto-Healing — TestSprite secara otomatis memperbaiki tes yang rusak ketika UI Anda berubah. Ini sangat berguna untuk tim dengan siklus sprint cepat.

  2. Mulai dengan Frontend Testing — Untuk aplikasi web Indonesia yang banyak menggunakan React/Vue, mulailah dengan mode Frontend sebelum beralih ke Backend.

  3. PRD Singkat sudah Cukup — Anda tidak memerlukan PRD lengkap. Bahkan deskripsi singkat dalam Bahasa Indonesia tentang fitur utama sudah cukup untuk TestSprite menghasilkan tes yang relevan.

  4. Integrasi CI/CD — Setelah pengujian lokal berhasil, integrasikan ke GitHub Actions untuk pengujian otomatis di setiap pull request.

Langkah Selanjutnya

Setelah berhasil menjalankan tes pertama Anda:

  • Tambahkan Tes Ekstra — Perluas cakupan tes dengan menambahkan tes tambahan ke proyek yang ada
  • Pemantauan Berkelanjutan — Siapkan eksekusi tes berkelanjutan dan pemantauan untuk proyek Anda
  • Integrasi GitHub — Hubungkan repositori GitHub Anda untuk pengujian otomatis di setiap pull request
  • Bergabung dengan Komunitas — Discord TestSprite

Terjemahan ini mencakup halaman: Introduction, Overview, Installation, dan First MCP Test dari dokumentasi resmi TestSprite di https://docs.testsprite.com

Kode, nama perintah, dan nama variabel tidak diterjemahkan sesuai konvensi teknis.

Top comments (0)