Connections
Connections are the arrows between components. Each one has a type — request, response, message, publish, data, control, or error — and the editor picks the type from the ports you connect.
Two ways to connect
On the canvas, drag from an output port to an input port (in Design mode). While you drag, ports that can accept the connection light up green; ports that can’t are crossed out. Prefer the keyboard? Open the Connect panel, pick the source component and output port, the target component and input port, add an optional label, and press Add typed connection. Both paths apply exactly the same rules.
Requests get their response for free
When you draw a request between two components, Mockflow automatically creates the return path — the dotted response line — and keeps the pair linked. The same happens when a service queries a database: the result connection appears by itself. You only ever draw the forward arrow.
The seven connection types
You never pick a type from a menu — it follows from the ports you connect. The line style and the small badge on each arrow tell you what kind of traffic it carries:
| Type | When you’ll see it |
|---|---|
| Synchronous request | One component asks another and waits for the answer. Solid teal line. |
| Synchronous response | The answer coming back. Dotted teal line — created for you automatically. |
| Asynchronous message | Fire-and-forget: send it and move on, like publishing to a queue. Dashed purple line. |
| Event publish | A topic delivering an event to one subscriber. Each subscription connection carries its own copy of the event. Fine-dotted purple line. |
| Data access | Reading or writing stored data — caches and databases. Solid amber line. |
| Control | A signal that steers behavior rather than carrying business data, like starting a timer. Solid dark-teal line. |
| Error | A failure path from a terminal port, like a gateway rejecting a request. Solid orange line. |
What the editor checks for you
Mockflow validates every connection as you make it, so a diagram that looks right also behaves right. The rules, in plain terms:
- Connections run from an output port to an input port — never the other way.
- Both ports must carry the same kind of thing. A request output cannot plug into an event input.
- A component cannot connect a port to itself.
- Each exact port-to-port connection can exist only once.
- Some ports have a connection limit — for example a queue's dispatch port takes one consumer.
- Draw the request first. Mockflow adds the matching response connection itself, so you never draw responses by hand.
When a connection is rejected, the editor tells you exactly why — for example “Connections must run from an output port to an input port.” Fix the reason and try again.