Stept

Record any browser workflow once and turn it into clean, step-by-step documentation your team and your AI tools can use.

Stept records a real workflow in your own logged-in browser and turns it into a polished guide: stable selectors, typed text, and per-step context are captured, secrets are redacted at the snapshot layer, and a deterministic cleanup pipeline produces consistent titles and steps without an LLM in the loop.

---

What you can do

• Record a workflow by driving your browser (manually, or via an agent over MCP). Steps capture stable selectors, typed text, and per-step context; secrets are redacted at the snapshot layer.
• View and share: guides render as slides, movies, expanded step lists, or an interactive sandbox built from captured DOM snapshots; publish and embed them publicly.
• Search and ask: workflows feed the knowledge base and RAG search, so answers cite the exact recorded steps.
• Sketch on whiteboards: embed collaborative whiteboards in any document (slash menu, "Whiteboard") — sketchy shapes, arrows with bindings, sticky notes, a searchable shape library, and live multiplayer cursors, powered by the in-repo @stept/whiteboard canvas engine.
• Let agents draw: whiteboards are fully agent- and MCP-manageable. Ask for a diagram and you get one — mermaid, DOT, draw.io, or .excalidraw text is laid out into real shapes with labels and bound arrows, and agents can also edit individual elements or stamp library stencils. Edits appear live for anyone with the board open; each tool toggles under Agent settings → Tools.
• Drive the browser over MCP: the per-agent endpoint /mcp/agents/{id} exposes browser_* and start_recording/stop_recording tools so an external LLM can record in your real, consented browser session.

Quick start

curl -fsSL https://stept.ai/install | sh

Checks prerequisites, generates this instance's secrets, brings the stack up and waits until it is actually serving. See scripts/install.sh — it is short and worth reading before you pipe it into a shell.

Or by hand

cp .env.example .env          # fill in the required secrets
docker compose up -d          # api, frontend, collab, db, redis
# open http://localhost:5173

Note that STEPT_ENCRYPTION_KEY must be a valid Fernet key (openssl rand 32 | base64 | tr '+/' '-_'), not just any random string — the installer does this for you.

Run the test suite:

make check         # lint + every test suite — the pre-push gate
make test          # backend, frontend, desktop, extension, cli, automation,
                   # collab, openapi drift
make test-e2e      # end-to-end: web (Playwright), desktop (Electron), extension
make lint          # ruff + a ratcheting TypeScript check

Both aggregates run every suite and print one summary at the end rather than stopping at the first failure, so a single run tells you everything that is broken:

══════════════ test summary ═════════════════════
  PASS  backend        5m56s
  FAIL  frontend         38s
  PASS  collab            6s
─────────────────────────────────────────────────
  1 of 3 suites failed in 6m40s
    re-run: make test-frontend

Add FAILFAST=1 to stop at the first failure instead. Individual suites run standalone too — make test-backend, make test-e2e-desktop, and so on; see make targets in the Makefile.

Why not Scribe / Tango?

	Stept	Scribe / Tango
Step-by-step capture	yes	yes
Interactive DOM sandbox viewer	yes	—
Knowledge base + RAG over recordings	yes	—
Self-hostable / open source	yes	—

Architecture

• api/ — Python (FastAPI) backend: recordings, MCP servers, AI tools (app/services/ai_tools/).
• app/ — TypeScript frontend.
• extension/ — the WXT browser extension that records in the user's tab, replays workflows and drives guided replay (src/entrypoints/).
• automation/, packages/ — the workflow engine the extension records into: capture, compile, replay and self-heal.
• collab/ — realtime collaboration server.
• cli/, desktop/ — command-line and desktop clients.
• landing/ — the stept.ai marketing site (Astro, static).
• docs-site/ — docs.stept.ai (Mintlify). Integration pages are generated from docs/integrations/setup/, which stays canonical.
• packages/brand/ — the logo, and the generator that fans it out to every shipped icon (web favicon, extension toolbar, desktop .icns/.ico/tray). Edit the SVG, run make brand-icons; nothing else hand-holds an icon.
• tokens/ — the colour palette shared by the app, desktop and extension. Edit tokens/tokens.json, run node tokens/build.mjs.

License

See LICENSE.