Quick Start

Execute with natural language input:

test the Taxa de Administração page
test Associativo frontend only with user moreira@vp6.com.br and password mypass
test backend only of Curva de Vendas page

Required parameters extraction:

• Page name (mandatory)
• Scope: FRONTEND/BACKEND/AMBOS (default: AMBOS)
• Credentials (default: teste@vp6.com.br/teste2026)
• Features to test (default: initial load, CRUD, version switching)

Workflow

Parse analyst input and display confirmation block:

╔══════════════════════════════════════════════╗
║ Test Configuration                           ║
╠══════════════════════════════════════════════╣
║ Page.........: <X>                          ║
║ Scope........: <FRONTEND | BACKEND | AMBOS> ║
║ Credentials..: <email>                      ║
║ Organization.: <X or "—">                   ║
║ Features.....: <list>                       ║
║ Notes........: <text or "—">                ║
╚══════════════════════════════════════════════╝

Progress:

• Parse input parameters
• Display configuration
• Verify environment (frontend :3000, backend :8000)
• Execute test stages A-H

STAGE A - Authentication [F+B]

• Login with parsed credentials
• For pro-planner: select organization from avatar dropdown
• Capture auth token for API calls

STAGE B - Page Mapping [F+B]

• Locate route in config/routes.ts
• Extract component path and endpoints
• Map CRUD operations to HTTP methods

STAGE C - Navigation [F]

• Navigate via sidebar menu to target page
• Verify URL matches route path

STAGE D - Required Selectors [F+B]

• Set version dropdown (if required)
• Set module dropdown (if required)
• Verify Redux state populated

STAGE E - Initial Load Verification [F+B]

• Validate network requests (200 status)
• Verify Redux state population
• Check DOM rendering matches API response

STAGE F - Functional Tests [F+B]

F.1 Addition (+ Add button)

• Click add button → drawer opens
• Fill form fields (use setReactInput for masked inputs)
• Save → verify POST 200 + drawer closes + table updates
• Confirm persistence via refetch

F.2 Editing (Edit icon)

• Click edit on table row → drawer opens populated
• Modify fields → save → verify PUT 200 + updates
• Confirm persistence via drawer reopen + refetch

F.3 Deletion (Delete icon)

• Click delete → popconfirm appears
• Confirm → verify DELETE 200 + row removed
• Confirm persistence via refetch

F.4 Main Form Save (if applicable)

• Capture baseline values
• Edit fields → save → verify PUT 200
• MANDATORY: Force refetch and verify persistence

STAGE G - Version/Module Switching [F]

• Switch version/module
• Verify continuous loading overlay
• Confirm data repopulation

STAGE H - Secondary Validations [F+B]

• Test filters, pagination, sorting
• Validate query parameters in requests

Examples

Example 1 - Default scope:

Input: "test Taxa de Administração page"
Scope: AMBOS (frontend + backend validation)
Flow: Full UI testing + API contract validation

Example 2 - Frontend only:

Input: "test Associativo frontend only with user moreira@vp6.com.br"
Scope: FRONTEND (UI/Redux/DOM only, backend treated as dependency)

Example 3 - Backend only:

Input: "test backend only of Curva de Vendas"
Scope: BACKEND (direct API calls, no browser interaction)

Best Practices

Speed Optimization:

• Use browser_evaluate for masked inputs instead of browser_type
• Minimize screenshots (4-6 per test maximum)
• Cache DOM snapshots between actions
• Use helpers for common operations:

JavaScript
// Set masked currency input (avoids concatenation bugs)
window.__setMaskedCurrency = (selector, reaisFloat) =>
  window.__setReactInput(selector, Math.round(reaisFloat * 100).toString());

// Read table data efficiently
() => {
  const rows = Array.from(document.querySelectorAll('.ant-table-row'));
  return rows.map(r => {
    const cells = Array.from(r.querySelectorAll('td')).map(c => c.innerText.trim());
    return { key: r.getAttribute('data-row-key'), cells };
  });
}

Critical Checkpoints:

• Always verify persistence via refetch (not just local state)
• Validate popconfirm appears before deletion
• Check Redux state matches API response
• Confirm loading overlays behave correctly

Common Pitfalls

• Never skip authentication even with existing session
• Don't use setTimeout - use browser_wait_for with text conditions
• Don't click randomly - each action must have validation purpose
• For masked inputs: Use setReactInput helper, not direct typing
• Version order matters: Always set VERSION before MODULE
• Missing persistence check: Always force refetch to verify backend save
• Network validation: Filter requests to reduce noise and latency

Mandatory order: LOGIN → MAP → NAVIGATE → VERSION → MODULE → LOAD → CRUD → REGRESSION

Stop execution on initial GET failure (4xx/5xx) - report as blocker, don't attempt workarounds.