The Flow Runner Interface

Understanding the Flow Runner layout and navigation.

Sidebar: Flow Groups & Flows

The sidebar shows a two-level tree: Flow Groups at the top level, and Flows nested inside each group.

Sidebar Actions:

•New Flow Group: Click the "+ New Flow Group" button at the top of the sidebar
•Expand/Collapse: Click a group name to expand or collapse its flow list
•Select a Flow: Click a flow name to load it in the design area
•New Flow: Click "+ New Flow" inside an expanded group
•Context Menu: Right-click a group for rename, delete, and environment options. Right-click a flow for rename, duplicate, and delete

The top bar displays navigation controls and breadcrumb information.

←|☰|⚡My API Tests›Login Flow

•Back arrow (←): Close the Flow Runner and return to the main workspace
•Hamburger (☰): Toggle the sidebar visibility
•Breadcrumb: Shows Group Name › Flow Name
•Unsaved indicator: An amber dot appears next to the flow name when there are unsaved changes
•Save button: Appears only when changes are unsaved

The main editing surface. A three-panel layout for building sequential flows:

Step List

⊕ Before All

POSTLogin

GETGet Profile

PUTUpdate Name

⊕ After All

Step Detail / Lifecycle Script / Execution Results

Select a step to configure its request, click Before All / After All to edit lifecycle scripts, or run the flow to see execution results here.

•Step List (left): Shows all steps in order. Drag to reorder. Click to select and configure.
•Sticky Before All / After All rails: The step list has a sticky Before All entry pinned to the top and a sticky After All entry pinned to the bottom. Click either to open the lifecycle script editor for that hook.
•Action Bar (top): Contains the environment selector, Run/Stop button with options dropdown, Results panel toggle, Clear Results, and Export dropdown.
•Run Options (dropdown): Click the arrow next to the Run button to access: Run with iterations, Parallel execution, Delay between steps, and Stop on failure toggle.
•Detail Area (right): When a step is selected, shows the full HTTP request editor with Pre-Script and Post-Script tabs. When Before All / After All is selected, shows the lifecycle script editor. When nothing is selected, shows execution results.

The Flow Runner warns you before losing unsaved work. A confirmation dialog appears in two cases:

•Closing the Flow Runner: If you have unsaved changes and click the back arrow, a dialog asks whether to close without saving
•Switching flows: If you select a different flow in the sidebar while the current flow has unsaved changes, a dialog asks whether to switch without saving