FlowScope renders message-flow XML as an interactive node graph with a
no-checkout PR review flow, model-aware diff overlay, and rich change
reporting. It turns reviewing an integration change into a normal VS
Code workflow — right next to the rest of your code.
What's a .msgflow file? An EMF / XMI XML document describing a
message flow — nodes (MQ, HTTP, Compute, Filter, SubFlow, …) wired
together by terminals. Common in enterprise integration platforms.
Features
View
| Tab |
What it shows |
| Diagram |
Interactive node graph. Pan, zoom, fit, drag-to-rearrange. Click any node to inspect properties; hover for a key-properties popover. Failure paths render as dashed red lines. |
| Connections |
Every external endpoint the flow touches, grouped by direction (inbound / outbound / external calls). Queues, HTTP endpoints, file paths, databases, JMS, Kafka, TCP/IP. |
| Dependencies |
Every external file the flow references — subflows, ESQL modules, Java classes, mappings, XSLT, schemas. One-click drill-down on subflows + ESQL. |
| Settings |
Flow-level configuration: user-defined properties (UDPs) and promoted node attributes. Click-to-edit on UDP defaultValue and description with type-locked input controls. |
| Glossary |
Every identifier the flow uses (queues, URLs, files, ESQL modules, subflows, …) inverted into one searchable list with use counts. |
Compare
- Compare with Branch / Ref… — two-step picker for target + source refs; pure ref-vs-ref diff that doesn't involve your working copy.
- Compare with File… — pick a second
.msgflow / .subflow from disk.
- Auto-diff on open — files with uncommitted changes load with the HEAD diff applied automatically.
- Flip direction in place from the diff badge — counts, colours, and the property-delta panel all update without re-running the picker.
- Focus mode to dim everything except changed nodes and their direct neighbours.
Modified nodes surface a "Changes since base" section in the property
panel with field-by-field before / after values. Removed nodes and
connections render as ghosts on the canvas at their original
positions so deletions are never invisible.
Review a PR — no checkout
Command Palette → FlowScope: Review a PR…
- Pick the target branch (what the PR merges into).
- Pick the source branch (the PR).
- FlowScope lists every
.msgflow / .subflow the PR touches and paints A / M / D badges on them in the Explorer tree.
- Open any changed file — it renders the source-ref version with a
source → target diff overlay applied automatically.
A status-bar item shows the active review and your local working copy
stays untouched throughout. Click the status bar to end the review.
Diagnostics
Four opt-in flow-quality checks publish to the Problems panel under the
flowscope source. Each has its own severity setting:
| Setting |
Default |
Catches |
flowscope.diagnostics.brokenEsqlRef |
error |
Compute / Filter ESQL ref resolves to no .esql file in the workspace. |
flowscope.diagnostics.brokenSubflowRef |
error |
SubFlow node points to a missing .subflow. |
flowscope.diagnostics.disconnectedNode |
warning |
Node with zero incoming AND zero outgoing connections. |
flowscope.diagnostics.unhandledFailure |
information |
Failure-emitting node (MQ Output, Compute, HTTP Request, etc.) with no failure-terminal handler. |
Raw XML view
Clicking XML opens the on-disk file in a regular text editor.
Modified files get prominent inline change indicators on top of VS
Code's git gutter:
- Added lines — green tint + 3px green left border + overview-ruler marker.
- Modified lines — amber tint + 3px amber left border + inline
↑ replaced: "…" marker showing the previous content.
- Deleted lines — inline
↓ removed: "…" marker on the line just before the deletion point.
Hover any inline marker for the full removed / replaced content as a
code-block tooltip. Side-by-side text diff is one Command Palette
entry away (FlowScope: View XML Diff (side-by-side)).
Markdown export
FlowScope: Export as Markdown… produces a portable spec doc with
embedded diagram (sibling .svg), connections tables, dependencies,
settings, and per-node detail blocks. Renders inline on GitHub,
Confluence, Notion, or email-rendered Markdown.
Configuration
| Setting |
Type |
Default |
Description |
flowscope.diagnostics.* |
enum |
per-rule |
See Diagnostics above. Values: error / warning / information / off. |
Commands
| Command ID |
Title |
flowscope.openFlow |
Open in FlowScope |
flowscope.compareWithRef |
Compare with Branch / Ref… |
flowscope.compareWithFile |
Compare with File… |
flowscope.clearCompare |
Clear Compare Overlay |
flowscope.reviewPR |
Review a PR… |
flowscope.endReview |
End PR Review |
flowscope.openAtSourceRef |
Open Current File at PR Source Ref |
flowscope.exportMarkdown |
Export as Markdown… |
flowscope.viewXmlDiff |
View XML Diff (side-by-side) |
Supported files
| Extension |
Format |
.msgflow |
Message flow (EMF / XMI XML) |
.subflow |
Reusable subflow (EMF / XMI XML) |
FlowScope is a third-party viewer for an open standard. It has no
affiliation with any specific tool vendor.
Security
- CSP-locked webview. Per-load nonce on every script tag;
script-src 'nonce-…' only; no 'unsafe-eval'.
- No remote resources.
default-src 'none'; img-src and font-src restricted to webview.cspSource.
localResourceRoots scoped to media/ only.- Read-only at git refs. The editor refuses writes when viewing a
git: URI (PR review at a ref).
- Property writes are scoped. Both the node-property and UDP editors operate on an allowlisted key set, regex-scoped to the matching XML element by id / name, with values XML-escaped.
- Zero runtime npm dependencies. No
eval, no new Function, no innerHTML for untrusted content.
Suitable for regulated environments and air-gapped networks.
License
PolyForm Noncommercial 1.0.0 — free for personal, research,
educational, and other noncommercial use. Commercial use requires a
separate commercial license.
