TestSprite MCP Server: 完整开发者审查 — 测试 React+TypeScript 与本地化处理经验 (印尼)

Source: Dev.to

项目测试

• 应用: 本地电子商务
• 技术栈: React 18 + TypeScript + Vite + Material UI + Node.js 后端

使用的 IDE

• Cursor 使用 TestSprite MCP Server

安装方法

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

安装完成后，只需在 Cursor 聊天中输入以下提示：

Can you test this project with TestSprite?

TestSprite 自动工作流（8 步）

1. Bootstrap environment – 检测端口、项目类型（前端）、范围（代码库）
2. Baca PRD – 解析上传文档中的需求
3. Analisis kode – 扫描整个结构、框架、功能
4. Generate Normalized PRD – 将原始 PRD 转换为 TestSprite 标准格式
5. Generate test plan – 自动生成 18 条测试用例，分为 4 类
6. Generate kode tes – 为每个测试用例生成 Playwright Python 脚本
7. Eksekusi di cloud – 隔离的沙箱环境，完整结果
8. Laporan & auto‑fix – 对失败的测试用例提供具体的修复建议

我的项目测试结果

所有六个失败的测试都提供了具体的改进建议——不仅仅是“测试失败”，而是“在 selector Y 中未找到组件 X，请添加 attribute id Z”。

我甚至不需要写一行测试代码。TestSprite 会分析代码库，自己生成 PRD，然后产出 18 条相关的测试用例——包括我从未想到的场景，例如：

• 将未认证用户从受保护的路由重定向
• 管理员面板访问控制
• 带特殊字符的边缘情况表单验证

对于通常没有专职 QA 的印尼开发者来说，这简直是 颠覆性改变。

生成的测试代码示例

所有生成的测试代码都保存在 testsprite_tests/ 文件夹中，采用 Playwright Python 格式，可随时重新运行。

# 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())

简洁、结构化，且可直接集成到 CI/CD 流水线。

自动“修复”交互

当我请求修复时：

Please fix the codebase based on TestSprite testing results.

AI 不仅“建议”，而是直接修改代码。例如：TC005（Admin Panel — Delete Button）失败，因为未找到选择器 #admin-delete-btn。AI 在正确的组件中添加了具有正确 ID 的按钮。

关于 locale handling 的重要发现

1. 日期格式

• 问题：TestSprite 生成的测试用例默认使用 MM/DD/YYYY（美国）格式。印尼应用使用 DD/MM/YYYY 或自然语言格式 “2 Mei 2026”。

• 示例（生成的，错误）：

  # US format — SALAH untuk ID
  assert "05/02/2026" in order_date_text  # MM/DD/YYYY

• 正确写法：

  # DD/MM/YYYY
  assert "02/05/2026" in order_date_text
  # 或自然语言格式
  assert "2 Mei 2026" in order_date_text

• 影响：6 个测试中有 2 个“失败”实际上是由于 locale 不匹配导致的 false positive，而不是代码错误。

• 建议：在 bootstrap 配置中添加 locale 选项。

  testsprite_bootstrap_tests({
    localPort: 5173,
    type: "frontend",
    locale: "id-ID",   // ← 这里需要设置
    timezone: "Asia/Jakarta"
  })

2. 货币格式（印尼盾）

• 问题：TestSprite 生成的断言默认假设 $150.00（美国）。印尼应用显示 Rp 150.000（千位点分隔，逗号作小数点）。

• 示例（生成的，错误）：

  price_text = await page.locator('.product-price').text_content()
  assert "$" in price_text  # ← 在印尼应用中始终失败

• 正确写法：

  assert "Rp" in price_text or "IDR" in price_text

• 变通办法：我手动编辑了 4 个与货币相关的测试文件。理想情况下，TestSprite 能够从应用代码中检测货币格式（例如字符串 “Rp” 或 “IDR”），并自动调整断言。

3. 非 ASCII 字符

TestSprite 表现良好，能够处理非 ASCII 输入（如 “Ä”、 “ñ”、 “é”、 “â”）。针对这些字符的专门测试用例能够验证它们在印尼用户名称中的有效性。

与其他方案的比较

结论

TestSprite MCP Server 显著加快了 QA 过程，尤其适用于印度尼西亚的小团队或独立开发者。通过在引导阶段添加对本地化（日期、货币、时区）的支持，这款工具将