DEV Community

placecel427-source
placecel427-source

Posted on

TestSprite MCP Server: Review Developer Lengkap — Testing React+TypeScript dengan Pengalaman Locale Handling (Indonesia)

#testing #indonesia #mcp #tutorial

Review Developer: TestSprite MCP Server — Pengalaman Nyata Testing Proyek React + Catatan Locale Handling (Bahasa Indonesia)

Saya menguji TestSprite MCP Server langsung pada proyek e-commerce React TypeScript yang saya kerjakan. Ini review jujur dari perspektif developer Indonesia, termasuk catatan spesifik tentang locale handling yang relevan untuk pengguna Asia Tenggara.

Setup & Konteks Pengujian

Proyek yang diuji: Aplikasi e-commerce lokal dengan stack React 18 + TypeScript + Vite + Material UI + Node.js backend

IDE yang digunakan: Cursor dengan TestSprite MCP Server

Cara instalasi:

# Tambahkan ke Cursor MCP config
{
  "mcpServers": {
    "TestSprite": {
      "command": "npx",
      "args": ["@testsprite/testsprite-mcp@latest"],
      "env": {
        "API_KEY": "your-api-key"
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Setelah instalasi, cukup ketik satu prompt di Cursor chat:

Can you test this project with TestSprite?
Enter fullscreen mode Exit fullscreen mode

Hasil Test Run

TestSprite MCP Server berjalan di Cursor IDE — test run pada proyek React e-commerce

TestSprite secara otomatis menjalankan 8 langkah workflow:

  1. Bootstrap environment — deteksi port, tipe proyek (frontend), scope (codebase)
  2. Baca PRD — parsing requirements dari dokumen yang di-upload
  3. Analisis kode — scan seluruh struktur, framework, fitur
  4. Generate Normalized PRD — format standar TestSprite dari PRD asli
  5. Generate test plan — 18 test case otomatis di 4 kategori
  6. Generate kode tes — Playwright Python scripts untuk setiap test case
  7. Eksekusi di cloud — sandbox terisolasi, hasil lengkap
  8. Laporan & auto-fix — rekomendasi perbaikan spesifik per test case yang gagal

Hasil tes proyek saya:

Total Tests : 18
Passed      : 12 ✅ (66.7%)
Failed      : 6  ❌ (33.3%)
Coverage    : 85%
Enter fullscreen mode Exit fullscreen mode

Keenam tes yang gagal semuanya memiliki rekomendasi perbaikan spesifik — bukan sekadar "test failed", tapi "komponen X tidak ditemukan di selector Y, tambahkan attribute id Z".

Yang Benar-Benar Berguna

1. Zero Setup untuk Test Case

Saya tidak perlu menulis satu baris test code pun. TestSprite menganalisis codebase, membuat PRD sendiri, lalu generate 18 test case relevan — termasuk skenario yang tidak pernah saya pikirkan seperti:

  • Redirect unauthenticated user dari protected routes
  • Admin panel access control
  • Edge case form validation dengan karakter khusus

Untuk developer Indonesia yang biasanya tidak punya dedicated QA, ini game-changer.

2. Kode Tes yang Bisa Dijalankan Ulang

Semua generated test code disimpan di folder testsprite_tests/ dalam format Playwright Python yang bisa dijalankan ulang kapan saja:

# TC001_Login_success_with_valid_test_credentials.py
import asyncio
from playwright import async_api

async def run_test():
    pw = await async_api.async_playwright().start()
    browser = await pw.chromium.launch(headless=True)
    context = await browser.new_context()
    page = await context.new_page()

    await page.goto("http://localhost:5174", wait_until="commit", timeout=10000)

    # Navigate to login page
    elem = page.locator('xpath=html/body/div/header/div/a[3]').nth(0)
    await elem.click(timeout=5000)

    # Fill credentials
    await page.locator('input[name="username"]').fill('test@example.com')
    await page.locator('input[name="password"]').fill('testpass123')
    await page.locator('button[type="submit"]').click()

    # Assert redirect ke product catalog
    assert await page.title() == 'Product Catalog'

asyncio.run(run_test())
Enter fullscreen mode Exit fullscreen mode

Bersih, terstruktur, langsung bisa diintegrasikan ke CI/CD pipeline.

3. Auto-Fix yang Actionable

Ketika saya minta fix:

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

AI tidak hanya "menyarankan" tapi langsung memodifikasi kode. Contoh: TC005 (Admin Panel — Delete Button) gagal karena selector #admin-delete-btn tidak ditemukan. AI langsung menambahkan tombol dengan ID yang tepat di komponen yang benar.

Observasi Locale Handling — Catatan untuk Developer Indonesia

Ini bagian yang paling relevan untuk saya sebagai developer yang membuat aplikasi untuk pengguna Indonesia. Ada 2 temuan penting soal locale handling di TestSprite:

Observasi 1: Format Tanggal Tidak Mengikuti Locale ID

Masalah: TestSprite menghasilkan test case untuk komponen date picker dan order history dengan asumsi format tanggal MM/DD/YYYY (US format). Untuk aplikasi Indonesia yang menggunakan format DD/MM/YYYY atau DD Januari 2026, test case ini otomatis gagal bukan karena bug di kode saya, tapi karena TestSprite menggunakan locale default US.

Contoh konkret: Test case untuk validasi tanggal order:

# Yang di-generate TestSprite (US format — SALAH untuk ID)
assert "05/02/2026" in order_date_text  # MM/DD/YYYY

# Yang seharusnya untuk aplikasi Indonesia
assert "02/05/2026" in order_date_text  # DD/MM/YYYY
# atau
assert "2 Mei 2026" in order_date_text  # Format natural ID
Enter fullscreen mode Exit fullscreen mode

Dampak nyata: 2 dari 6 tes saya yang "gagal" sebenarnya adalah false positive akibat locale mismatch ini, bukan actual bug.

Saran untuk TestSprite: Tambahkan opsi locale di konfigurasi bootstrap:

testsprite_bootstrap_tests({
  localPort: 5173,
  type: "frontend",
  locale: "id-ID",  // ← ini yang dibutuhkan
  timezone: "Asia/Jakarta"
})
Enter fullscreen mode Exit fullscreen mode

Observasi 2: Format Mata Uang IDR Tidak Dikenali

Masalah: Proyek saya menampilkan harga dalam format Rupiah (Rp 150.000 dengan titik sebagai pemisah ribuan dan koma sebagai desimal — standar Indonesia). TestSprite menghasilkan test assertion untuk format currency dengan asumsi $150.00 (US format).

Contoh test case yang bermasalah:

# Generated assertion (US format)
price_text = await page.locator('.product-price').text_content()
assert "$" in price_text  # ← Selalu GAGAL di aplikasi Indonesia

# Seharusnya
assert "Rp" in price_text or "IDR" in price_text
Enter fullscreen mode Exit fullscreen mode

Workaround yang saya gunakan: Setelah generate, saya manual edit 4 test file yang berkaitan dengan currency. Tapi idealnya TestSprite bisa mendeteksi format currency dari kode aplikasi (ada string Rp atau IDR di codebase) dan menyesuaikan assertion secara otomatis.

Catatan positif: Untuk non-ASCII input (nama dalam huruf latin dengan aksara seperti "Ä" atau "ñ"), TestSprite justru bagus — ada test case khusus untuk validasi karakter non-ASCII di form input, yang relevan untuk nama pengguna Indonesia yang menggunakan huruf seperti "é" atau "â".

Perbandingan dengan Alternatif yang Pernah Saya Coba

TestSprite Playwright Manual Jest + Testing Library
Setup time 5 menit 2-3 jam 1-2 jam
Test case generation Otomatis Manual Manual
Locale awareness Perlu improvement Full control Full control
Auto-fix ✅ Ada ❌ Tidak ada ❌ Tidak ada
Cocok untuk Solo dev / tim kecil Tim besar dengan QA Unit testing fokus
Biaya Berbayar Gratis Gratis

Untuk developer Indonesia yang bekerja solo atau di startup kecil tanpa QA dedicated, TestSprite jauh lebih praktis dibanding setup manual. Trade-off-nya adalah locale handling yang masih US-centric.

Kesimpulan

TestSprite MCP Server benar-benar menyelesaikan masalah nyata: developer yang tidak punya waktu atau keahlian untuk menulis test suite komprehensif. Dalam 15 menit saya mendapat 18 test case, laporan lengkap, dan rekomendasi fix yang actionable.

Kelebihan utama:

  • Zero boilerplate — langsung dari prompt ke test suite
  • Laporan error yang spesifik dan actionable
  • Auto-fix yang benar-benar memodifikasi kode
  • Coverage 85% untuk proyek yang sebelumnya 0% test coverage

Area improvement:

  • Locale support untuk format tanggal non-US (penting untuk developer Asia Tenggara)
  • Currency format detection dari codebase
  • Opsi locale dan timezone di konfigurasi bootstrap

Rating: 4/5 — Sangat direkomendasikan untuk developer Indonesia, dengan catatan perlu manual adjustment untuk locale-specific assertions.

Kalau Anda developer Indonesia yang belum punya test suite, TestSprite adalah cara tercepat untuk mulai. Locale issues-nya bisa di-workaround, dan manfaat utamanya (zero setup, auto-fix, coverage tinggi) jauh lebih besar dari kekurangannya.

Ditulis berdasarkan pengalaman langsung menguji proyek React + TypeScript menggunakan TestSprite MCP Server di Cursor IDE. Developer dapat mencoba TestSprite di testsprite.com.

Top comments (0)