📊 AiScripto Workflow

Empower your testing with AI-generated scripts and intelligent self-healing.

Complete Transformation Pipeline

AiScripto transforms hand-written test cases into production-grade Playwright tests through multiple coordinated AI agents. The entire process is automated, traceable, and controllable.

%%{init: {'flowchart': {'htmlLabels': true}, 'theme': 'default', 'themeVariables': {'fontSize': '16px', 'fontFamily': 'arial'}}}%% graph TB A["📝 Hand-Written Test Cases
Plain Text / Markdown"] B["✅ Validate
/validate"] C["🔍 Explore
/explore"] D["⚙️ Generate
/generate"] E["▶️ Execute
/execute"] F["🔧 Self-Heal
/heal"] G["📦 Output
Playwright + POMs"] H["📊 Parameterize
/parameterize
Optional"] A --> B B --> C C --> D D --> E E --> F F --> G G --> H style A fill:#ff9900,stroke:#333,stroke-width:3px,color:#fff,font-size:14px style B fill:#0066cc,stroke:#333,stroke-width:3px,color:#fff,font-size:14px style C fill:#4caf50,stroke:#333,stroke-width:3px,color:#fff,font-size:14px style D fill:#2196F3,stroke:#333,stroke-width:3px,color:#fff,font-size:14px style E fill:#f44336,stroke:#333,stroke-width:3px,color:#fff,font-size:14px style F fill:#ff5722,stroke:#333,stroke-width:3px,color:#fff,font-size:14px style G fill:#673ab7,stroke:#333,stroke-width:3px,color:#fff,font-size:14px style H fill:#00bcd4,stroke:#333,stroke-width:3px,color:#fff,font-size:14px

💡 Each Stage is Optional

You can skip or repeat any stage. For example, if a test passes validation but fails execution, you can proceed directly to healing without re-exploring.

Phase 1: Import & Validation

📥 Test Case Import

AiScripto supports importing test cases from multiple sources:

  • Local Files
    .txt, .md Markdown documents
  • Azure DevOps
    Direct reading from test plans
  • Jira / GitHub
    Import from Issues and Epics
  • Google Docs
    Sync from collaborative documents
  • REST API
    Custom data source integration

✅ Validation Checklist

Syntax validation

Comments check

Precondition validation

Format normalization

Duplication detection

Relevance analysis

Test Case Format Example

@TC_ID: TC-001
@Title: Create New Order
@Author: QA Team
@Tags: smoke, order-creation

**Preconditions:**
- User is logged into the system.
- User has order creation permissions

**Steps:**
Step 1: Navigate to the order management page
  Expected: Order list is displayed

Step 2: Click the "Create New Order" button
  Expected: Order creation dialog is opened

Step 3: Enter "ORD-2024-001" in the "Order Number" field
  Expected: Number is displayed in the field

Step 4: Enter "ABC Corporation" in the "Customer Name" field
  Expected: Customer name is auto-completed and suggestions are displayed

Step 5: Select the first suggested customer
  Expected: Customer information is automatically filled

Step 6: Set the order amount to $10,000
  Expected: Amount is displayed correctly

Step 7: Click the "Submit" button
  Expected: Order is created successfully, returns to order list

Phase 2: UI Exploration

🔭 Real-time Browser Exploration

After validation is complete, AiScripto launches a real browser instance and follows the test case steps to perform actual operations while collecting UI element information.

🌐 Real-time Browser Navigation

AI operates the browser according to test steps, interacting with real UI

🎯 Element Localization

Capture multiple locator options for each interactive element, prioritizing accessible selectors

📸 Visual Analysis

Use AI vision models to understand UI layout, colors, text and icons

💾 Knowledge Accumulation

Store known pages and elements in locator cache to accelerate future tests

graph TB A["🤖 AI Agent
Start Exploration"] B["📖 Read Test Steps
Step 1: Navigate to URL"] C["🌐 Launch Browser
Access Application"] D["👁️ Visual Analysis
Page Content"] E["🔍 Find Elements
Buttons, Fields, etc"] F["📝 Record Locators
CSS, XPath, Role etc"] G["➡️ Execute Next Step
Click, Input, Verify"] H["✅ Step Complete"] I["📦 Generate Locator Library"] A --> B B --> C C --> D D --> E E --> F F --> G G --> H H -->|More Steps| B H -->|Complete| I style A fill:#ff9900,stroke:#333,stroke-width:2px,color:#fff style I fill:#4caf50,stroke:#333,stroke-width:2px,color:#fff style B fill:#0066cc,stroke:#333,stroke-width:2px,color:#fff style C fill:#2196F3,stroke:#333,stroke-width:2px,color:#fff style D fill:#9C27B0,stroke:#333,stroke-width:2px,color:#fff style E fill:#f44336,stroke:#333,stroke-width:2px,color:#fff style F fill:#ff5722,stroke:#333,stroke-width:2px,color:#fff

Phase 3: Code Generation

⚙️ Automated Code Synthesis

After exploration is complete, AiScripto uses the collected UI information to generate Playwright TypeScript code that follows industry best practices.

📦 Generated Output

📄 tests/TC-*.spec.ts

Complete Playwright test specifications

📚 src/pages/*.ts

Page Object Models (POM)

🔗 fixtures/*.ts

Shared fixtures (login, setup, etc)

📊 *.data.json

Parameterized test data

📋 report.json

Execution reports and analysis

Code Generation Features:

  • Type Safe
    Complete TypeScript type definitions
  • High Readability
    Clear variable names and logic flow
  • Maintainability
    Follow official Playwright best practices
  • Error Handling
    Comprehensive exception handling and logging
  • Performance Optimization
    Smart wait and timeout configuration
  • Testability
    Can be directly run and modified

Generated Test Code Example

import { test, expect } from '@playwright/test';
import { OrderPage } from '../pages/OrderPage';

test.describe('Order Management Test Suite', () => {
  let page;
  let orderPage: OrderPage;
  
  test.beforeEach(async ({ page: p }) => {
    page = p;
    orderPage = new OrderPage(page);
    
    // Login to application
    await page.goto('https://app.example.com/login');
    await page.getByRole('textbox', { name: /Username/ }).fill('testuser');
    await page.getByRole('textbox', { name: /Password/ }).fill('password');
    await page.getByRole('button', { name: /Login/ }).click();
  });
  
  test('TC-001: Create New Order', async () => {
    // Step 1: Navigate to Order Management page
    await page.goto('https://app.example.com/orders');
    await expect(page.getByRole('table')).toBeVisible();
    
    // Step 2: Click Create New Order button
    await orderPage.clickCreateButton();
    await expect(page.getByRole('dialog')).toBeVisible();
    
    // Step 3-7: Fill form and submit
    await orderPage.fillOrderNumber('ORD-2024-001');
    await orderPage.fillCustomerName('ABC Corporation');
    // ... more steps
    
    // Verify results
    await expect(
      page.getByText(/Order created successfully/)
    ).toBeVisible();
  });
});

Phase 4: Execution & Self-Healing

▶️ Test Execution

Generated tests are executed using the Playwright test runner. If all pass, congratulations! If any fail, AiScripto automatically performs repair.

graph LR A["▶️ Execute Tests"] B{Test Results} C["✅ All Passed"] D["❌ Tests Failed"] E["📸 Capture Failure State
Screenshots + Trace"] F["🔍 AI Analysis
Identify Changes"] G["🔧 Auto Repair
Update Locators/Logic"] H["▶️ Re-Execute
Verify Repair"] I["✅ Repair Success"] J["⚠️ Manual Intervention Needed"] A --> B B -->|Pass| C B -->|Fail| E E --> F F --> G G --> H H -->|Success| I H -->|Still Fails| J style A fill:#4caf50,stroke:#333,stroke-width:2px,color:#fff style C fill:#4caf50,stroke:#333,stroke-width:2px,color:#fff style I fill:#4caf50,stroke:#333,stroke-width:2px,color:#fff style E fill:#f44336,stroke:#333,stroke-width:2px,color:#fff style J fill:#ff9900,stroke:#333,stroke-width:2px,color:#fff

🔧 Self-Healing Intelligence

📹 Execution Trace Analysis

Analyze detailed Playwright execution logs and screenshots, pinpoint failure precisely

🤖 Visual Reasoning

Use AI vision models to compare expected and actual UI, identify visual changes

🔄 Locator Search

Try multiple alternative locators, find most robust choice, improve repair success rate

📚 Knowledge Reuse

Learn from locator cache and previous repair records, accelerate repair process

✅ Repair Success Rate

85-95% of test failures can be resolved through automatic repair, with no manual intervention needed

Phase 5: Parameterization (Optional)

📊 Data-Driven Test Conversion

After completing basic tests, you can optionally extract hard-coded test data to JSON files, allowing the same test to execute with multiple data sets.

Extraction Process:

  • 1. Data Identification
    AI scans code to identify all hard-coded values
  • 2. Categorize Data
    Group by type (orders, customers, amounts, etc.)
  • 3. Generate Data File
    Create structured JSON data
  • 4. Parameterize Code
    Replace hard-coded values with variables
  • 5. Validate Execution
    Run tests with all data combinations

Conversion example

Before (Hard-coded):

await orderPage.fillOrderNumber('ORD-001');
await orderPage.fillAmount(5000);
await orderPage.fillCustomer('ABC Corp');

After (Parameterization):

await orderPage.fillOrderNumber(testData.orderId);
await orderPage.fillAmount(testData.amount);
await orderPage.fillCustomer(testData.customer);

Test Data File Structure

// tests/data/order-creation.data.json
{
  "testCases": [
    {
      "id": "ORD-001",
      "orderId": "ORD-2024-001",
      "customer": "ABC Corporation",
      "amount": 5000,
      "expectedStatus": "Successfully established"
    },
    {
      "id": "ORD-002",
      "orderId": "ORD-2024-002",
      "customer": "XYZ Limited",
      "amount": 15000,
      "expectedStatus": "Successfully established"
    },
    {
      "id": "ORD-003",
      "orderId": "ORD-2024-003",
      "customer": "QRS Industries",
      "amount": 8500,
      "expectedStatus": "Successfully established"
    }
  ]
}

Result: 1 test × 3 data combinations = 3 complete test executions, covering different business scenarios

📋 Workflow Command Reference

Command Function When to Use Output
/import Import test cases Add new test cases to system imported-cases.json
/validate Validate test format Check test case syntax and completeness validation-report.json
/explore Explore UI and collect elements Create new tests or update stale locators locators.json, screenshots/
/generate Generate Playwright code Create executable tests from test cases tests/TC-*.spec.ts, pages/
/execute Run tests Verify generated tests pass test-results.json, traces/
/heal Auto-repair failed tests Fix test failures without re-writing healed-tests/, healing-report.json
/parameterize Extract and parameterize data Convert hard-coded data to data-driven *.data.json, parameterized-tests/
/verify Final verification Re-execute with all data combinations final-verification-report.json

⏱️ Typical Timeline

Below is the typical time expectation for an AiScripto test development cycle:

1-2 Mins

Test Case Authoring

Describe test steps using intuitive natural language.

30-45 Secs

Validation & Exploration

AI checks formatting and explores UI in real-time applications.

1-2 Mins

Code Generation & Execution

Generate test code and execute validation immediately.

Immediately

Automatic Repair (if needed)

If failed, AI automatically repairs and re-executes

Optional: 1 Min

Parameterization

If needed, extract data and create multiple test scenarios

⏱️ Total Time: 3-5 Minutes

Traditional Method: 2-3 Hours (Writing + Debugging + Testing)
AiScripto: 3-5 Minutes
Time Saved: 90% ⚡