Introducing the Workflow Simulator

What is the Workflow Simulator?

The simulator lets you execute your workflow directly in the editor. Toggle Simulate in the toolbar to enter play mode.

How It Works

When you activate the simulator:

• Active states glow green with a pulse animation
• Available transitions highlight — click them to advance
• Unavailable transitions dim to 30% opacity
• The canvas becomes read-only — no dragging, connecting, or deleting

The Simulator Panel

A panel appears at the bottom of the canvas showing:

• Current State — badges for each active place with token counts
• Available Transitions — clickable buttons to fire transitions
• History — a log of every step with from/to markings

Auto-Play

Click the play button in the simulator footer to enable auto-play. The simulator will randomly pick an available transition and fire it at a configurable interval (0.5s, 1s, or 2s).

Auto-play stops automatically when no transitions are available (dead end).

Step Back

Made a wrong choice? Click Step Back to revert to the previous marking. The engine restores the exact state from before the last transition.

Reset

Click the reset button to return to the initial marking and clear all history.

Under the Hood

The simulator is powered by a TypeScript workflow engine that mirrors Symfony's Workflow component. It tracks markings, evaluates transitions, supports guards, and fires events in the correct Symfony order.