Stepflow Debugger 3.0.1

Debug UI and API, one step at a time.

UI-first flows use the injected debugger panel. API-only and API-first flows use a standalone Stepflow window; when a mixed test reaches its first browser step, debugging continues inside the tested page.

See the workflow ↓Command reference

API-aware interface

Standalone for API. Injected for browser UI.

The previews below show the same Stepflow model in both halves of a v2 test. API details stay redacted, while UI steps keep the tested page visible underneath the injected panel.

API-first · standaloneRequest, response and current source step

RUVIOLTASTEPFLOW DEBUGGER

Project: API ExampleStep 2 of 7

Verify a user and continue with captured data

API-only flow · tests/api.utNo browser has been launched

api("GET", "/users/{id}", { path: { id: userId } })

tests/api.utLine 8

GET /users/1 → 200 · 42 msResponse JSON available · sensitive values redacted

Mixed flow · injectedCaptured API data drives the next browser step

RUVIOLTA · Step 6 of 8

visit("https://example.com/?verifiedUser=" + verifiedUserId)

Workflow

Inspect → edit → retry → decide

Run exactly the current UI or API step. The button stays disabled until the complete action or request finishes.

✎

Edit & Retry

Edit a supported single-line browser or API step before execution or after failure, then retry it immediately.

✓

Apply to code

When a retry passes, write the successful line back to the correct .ut source while preserving indentation and line endings.

API

Request details

API steps can show safe request/response summaries, status, timing and redacted details without exposing configured secrets.

Exit stays available

Exit remains available while a browser action, API request, polling delay or streaming wait is running.

↗

Nested flows & cases

Reusable run() flows and data Cases: keep their project, file, scenario and current case context visible.

Mixed transition

API-first does not force a browser open

mixed-ui-api.ut

api("GET", "/users/1")
Verify:
  expectStatus(200)
  expectExists("$.name")

captureJson("$.id") -> verifiedUserId

visit("https://example.com/?verifiedUser=" + verifiedUserId)
waitForText("body", "Example Domain")

Two surfaces, one debug session

The standalone debugger handles the API steps. When visit() needs the browser, Ruviolta starts the configured browser, closes the standalone window and continues with the injected panel in the tested page.

Start debugging

Use the same project and test selectors

Terminal

ruviolta debug projects/api-example "@getPost"
ruviolta debug projects/api-example "@uiAndApi"

# Equivalent run flag:
ruviolta run projects/api-example "@uiAndApi" --debug

With a project-local npm installation, prefix these CLI commands with npx unless Ruviolta is already on PATH. API-only debugging uses the standalone Stepflow window. A headless project temporarily opens a visible browser only when a debugged flow actually reaches UI steps.