Skip to main content

Overview

AutoMFlows provides a visual workflow builder with a drag-and-drop interface for creating browser automation and API testing workflows. Each workflow consists of nodes connected by edges, defining the execution flow.

Workflow Structure

A workflow in AutoMFlows consists of two main components:
  • Nodes: Individual actions or operations (browser automation, API calls, data manipulation)
  • Edges: Connections between nodes that define the execution order

Workflow JSON Format

{
  "nodes": [
    {
      "id": "start-1770483184162",
      "type": "start",
      "position": { "x": 100, "y": 200 },
      "data": {
        "type": "start",
        "label": "Start"
      }
    }
  ],
  "edges": [
    {
      "id": "edge-start-openBrowser",
      "source": "start-1770483184162",
      "target": "openBrowser-1770483184162-rfm2mz3hq",
      "sourceHandle": "output",
      "targetHandle": "input"
    }
  ]
}

Creating a Workflow

1

Start with a Start Node

Every workflow begins with a Start node. This node is automatically added when you create a new workflow.
{
  "id": "start-1770483184162",
  "type": "start",
  "position": { "x": 100, "y": 200 },
  "data": {
    "type": "start",
    "label": "Start"
  }
}
2

Add Nodes from the Sidebar

Drag nodes from the sidebar onto the canvas. AutoMFlows provides 20+ node types:
  • Browser Nodes: Open Browser, Navigate, Close Tab
  • Interaction Nodes: Click, Type, Hover, Drag & Drop
  • Data Nodes: Get Text, Screenshot, Data Extractor
  • API Nodes: API Request, API cURL
  • Control Flow: Wait, Loop, Conditional
  • Verification: Verify (browser & API)
3

Connect Nodes

Connect nodes by dragging from the output handle of one node to the input handle of another. Connections define the execution order.
Nodes execute sequentially following the connection path. A node waits for its predecessor to complete before executing.
4

Configure Node Properties

Click on a node to open the properties panel on the right side. Each node type has specific configuration options.See Node Configuration for detailed property options.
5

Save the Workflow

Click the Save button in the toolbar to download the workflow as a JSON file. The file can be loaded later or shared with others.
Workflows are saved in JSON format and can be version-controlled using Git.

Example: E-commerce Test Workflow

Here’s a complete workflow from the AutoMFlows repository that tests a Shopify demo site:
{
  "nodes": [
    {
      "id": "start-1770483184162",
      "type": "start",
      "data": { "label": "Start" }
    },
    {
      "id": "openBrowser-1770483184162-rfm2mz3hq",
      "type": "openBrowser",
      "data": {
        "label": "Open Browser",
        "headless": false,
        "browser": "chromium",
        "viewportWidth": 1280,
        "viewportHeight": 720
      }
    },
    {
      "id": "navigate-1770483184162-8r31zzhd2",
      "type": "navigation",
      "data": {
        "label": "Navigate to Sauce Demo",
        "action": "navigate",
        "url": "https://sauce-demo.myshopify.com/",
        "waitUntil": "networkidle"
      }
    },
    {
      "id": "click-1770483184162-a72iynaf6",
      "type": "action",
      "data": {
        "label": "Click Sign up",
        "action": "click",
        "selector": "a:has-text(\"Sign up\")",
        "selectorType": "css"
      }
    },
    {
      "id": "verify-1770483184162-enows72co",
      "type": "verify",
      "data": {
        "label": "Verify Create Account label",
        "domain": "browser",
        "verificationType": "text",
        "selector": "h1:has-text(\"Create Account\")",
        "expectedValue": "Create Account"
      }
    }
  ],
  "edges": [
    {
      "id": "edge-1",
      "source": "start-1770483184162",
      "target": "openBrowser-1770483184162-rfm2mz3hq"
    },
    {
      "id": "edge-2",
      "source": "openBrowser-1770483184162-rfm2mz3hq",
      "target": "navigate-1770483184162-8r31zzhd2"
    },
    {
      "id": "edge-3",
      "source": "navigate-1770483184162-8r31zzhd2",
      "target": "click-1770483184162-a72iynaf6"
    },
    {
      "id": "edge-4",
      "source": "click-1770483184162-a72iynaf6",
      "target": "verify-1770483184162-enows72co"
    }
  ]
}

Loading Workflows

There are multiple ways to load and execute workflows:

Via Web Interface

  1. Click the Load button in the toolbar
  2. Select a workflow JSON file from your computer
  3. The workflow appears on the canvas
  4. Click Run to execute

Via API

Execute a workflow directly using the REST API:
curl -X POST http://localhost:3003/api/workflows/execute \
  -H "Content-Type: application/json" \
  -d '{
    "workflow": {
      "nodes": [...],
      "edges": [...]
    },
    "executionMode": "single",
    "workflowFileName": "my-workflow.json"
  }'

Execution Modes

AutoMFlows supports two execution modes:

Single Mode

Execute one workflow at a time with full debugging support, breakpoints, and live node highlighting.Use cases:
  • Workflow development and debugging
  • Interactive testing
  • Step-by-step execution

Parallel Mode

Execute multiple workflows concurrently with configurable worker pools.Use cases:
  • Batch testing
  • CI/CD pipelines
  • Load testing

Single Mode Example

{
  "workflow": { /* workflow definition */ },
  "executionMode": "single",
  "workflowFileName": "my-test.json",
  "traceLogs": true,
  "breakpointConfig": {
    "enabled": true,
    "breakpointAt": "pre",
    "breakpointFor": "marked"
  }
}

Parallel Mode Example

{
  "folderPath": "./tests/workflows/sample",
  "executionMode": "parallel",
  "workers": 4,
  "recursive": true,
  "pattern": "*.json",
  "outputPath": "./output"
}

Builder Mode

Builder Mode allows you to record browser actions and automatically generate workflow nodes.

Starting Builder Mode

1

Start Recording

curl -X POST http://localhost:3003/api/workflows/builder-mode/start
2

Perform Actions

Interact with the browser. Actions like clicks, typing, and navigation are automatically recorded.
3

Retrieve Recorded Actions

curl -X GET http://localhost:3003/api/workflows/builder-mode/actions
4

Stop Recording

curl -X POST http://localhost:3003/api/workflows/builder-mode/stop

Best Practices

Use Descriptive Labels

Give each node a clear, descriptive label that explains its purpose. This makes workflows easier to understand and maintain.

Add Wait Nodes

Insert Wait nodes between actions to ensure page elements load before interaction. Use waitUntil: "networkidle" for navigation nodes.

Enable Retry Strategies

Configure retry options on critical nodes to handle transient failures. Use exponential backoff for API calls.

Use Verification Nodes

Add Verify nodes after critical operations to validate expected outcomes and catch errors early.

Variables and Context

Workflows can use variables stored in the execution context:
// In a JavaScript Code node
const data = {
  username: 'testuser',
  email: '[email protected]'
};
context.setData('userData', data);
Reference variables in other nodes using ${contextKey} syntax:
{
  "type": "formInput",
  "data": {
    "selector": "input[name='email']",
    "value": "${userData.email}"
  }
}

Next Steps

Node Configuration

Learn how to configure individual nodes with properties, retry strategies, and wait conditions.

Browser Automation

Dive deep into browser automation with Playwright nodes.

API Testing

Test REST APIs with API Request and cURL nodes.

Reports

Generate execution reports in multiple formats.

Build docs developers (and LLMs) love