The Intellij SFCC Pipeline Editor opens pipeline XML as an editable graph. Use it to change flow and node properties, follow linked scripts and templates, and set pipeline breakpoints. The XML remains the source document you save and deploy
Open a pipeline
Open the pipeline XML
Open a file matching **/cartridge/pipelines/*.xml or **/pipelines/*.xml. Choose Intellij SFCC Pipeline Editor through VS Code's Reopen Editor With… if another editor opens by default
Switch between graph and source
Use Show Pipeline Source Code in the editor title bar to work with XML. Use Show Pipeline Editor to return to the graph. For a new file, use B2C - Create Pipeline... from the Explorer context menu
Find the flow you need
Use Search nodes or breakpoints to locate a node, Entries to browse entry points, or Groups to find related pipelines. Opening a pipeline route from Smart Search focuses its entry in the graph
Edit the graph
Drag flow nodes or pipelets from the sidebar onto the canvas. Select a node or connection to edit its Properties, then arrange nodes and transitions to express the flow. Hold Shift and drag a rectangle to select several nodes, as you select files on your desktop, then move, copy or delete them together. Undo and Redo apply to graph edits; Sidebar and Details show or hide the supporting panels
The editor writes graph changes back into the open XML document. Its status (Modified, Saving, Saved, No changes) describes that synchronization, and the editor tab shows the unsaved dot until you save. Press Cmd+S or Ctrl+S to write the file before reviewing the diff or deploying it. Source edits are reflected in the graph, and Refresh reloads the graph from the current XML document
Graph editing and source navigation work on local project files. They do not execute the pipeline or deploy it to an instance
Select and move nodes
Selecting nodes works like selecting files on your desktop. Hold Shift and drag on empty canvas to draw a rectangle around the nodes you want, Cmd-click (Ctrl-click on Windows and Linux) to add or remove one more, then drag any of them to move the whole selection. The Select several chapter of the editor tour above plays the whole sequence
| Mouse | What it does |
|---|---|
| Click a node or connection | Selects it in place of the current selection and shows it in Properties. A node also gets its halo, the buttons that delete, rotate or unlink it |
Hold Shift and drag on empty canvas | Draws a selection rectangle. Every node it touches is selected, in place of the current selection. Drag to the edge of the canvas and the graph scrolls along |
| Cmd-click (Ctrl-click on Windows and Linux) | Adds a node to the selection, or removes it from the selection |
| Drag a selected node | Moves every selected node. Transitions between them keep their bend points, and near the edge of the canvas the graph scrolls along |
| Click or drag empty canvas | Clears the selection. A drag also pans the graph |
Each selected node gets a blue frame, and the node you clicked or dragged last keeps the halo. Properties closes while more than one node is selected and comes back when you click a single node
Copy, paste and delete
Right-click a node and choose Copy to copy the selected nodes and the transitions between them, then right-click empty canvas and choose Paste. The copies land where you clicked and become the new selection, and pasted start nodes get a unique name. Cmd+C and Cmd+V (Ctrl+C and Ctrl+V) do the same while the graph has the focus. The editor keeps its own clipboard, so paste in the same pipeline editor
Delete or Backspace removes the selected nodes and transitions after a Confirm Action prompt
Zoom and pan
Zoom the graph the way you zoom a map, something the Eclipse UX Studio pipeline editor never had. The zoom is anchored at the pointer, so the node under it stays in place while the rest of the pipeline scales around it. Pull back to see the whole flow, then zoom straight into the node you want
| Gesture | What it does |
|---|---|
| Pinch on a macOS trackpad | Spread two fingers to zoom in, pinch them together to zoom out |
Hold Cmd or Ctrl and scroll | Scroll up to zoom in, down to zoom out |
| Scroll, or swipe with two fingers | Pans the graph |
Hold Shift and scroll | Pans sideways |
| Minimap › Reset | Returns to 100% |
| Minimap › Hide | Closes the minimap |
Minimap sits in the bottom-right corner of the graph and shows the part of the pipeline in view
Follow scripts, templates, and pipeline calls
Resource fields in the Properties panel offer completion, Browse, and Go To. Use them to select an indexed script, template, or pipeline target and open its source. If more than one cartridge supplies a target, the source picker shows the cartridge and file location
For example, a Script node can reference app_demo:catalog/LoadProduct.ds. Go To opens that script; Browse helps find a different indexed script without entering its full path
Script dictionary inputs and outputs come from the linked script's @input and @output annotations. Updating the Script node's target lets the editor use that script's indexed parameter definitions when presenting its dictionary mappings
/**
* @input ProductID : String
* @output Product : dw.catalog.Product
*/
function execute(args) {
// Use args.ProductID and assign args.Product in your script.
}For route nodes, References lists indexed callers in scripts, templates, and XML. Opening a reference that sits in a pipeline opens that pipeline and focuses the exact Call or Jump node behind it. Endpoint actions use the active connection and site scope; opening a source reference uses local files
XML language intelligence
In source view, completion and Go to Definition understand SFCC resource attributes:
| XML location | Assistance |
|---|---|
start-name-ref on <call-node> or <jump-node> | Complete pipeline routes and navigate to their target |
value on <config-property key="ScriptFile"> | Complete linked scripts and open the script declaration |
name on a static <template> | Complete and navigate to ISML templates. Dynamic template values are excluded from this lookup |
type and group on <pipeline> | Complete supported pipeline types and indexed groups |
This helps keep graph properties and hand-edited XML connected to the same workspace resources. Pipeline files have no bundled schema, so XML Validation does not check them
Node icons in the gutter
In source view, each node line carries the icon the graph draws for that node type, so you can scan the XML for start, end, stop, call, jump, decision, join, loop, interaction, text, and pipelet nodes. Private start nodes, interaction continue nodes, pipelet placeholders, and Script, Assign, and Eval pipelets have their own icons. Nodes inside XML comments get no icon, and the icons follow your edits as you type
The icons only mark node types; they have no click action. On a start node line that defines a route, the node icon takes the place of the route icon, and hovering the line still shows the route's endpoint details. Turn the icons off with intellij-sfcc.pipelines.nodeGutterIcons in Settings. They need active Intellij SFCC access
Set and use pipeline breakpoints
Add a breakpoint to a node
Select a pipeline node and click Breakpoint in the graph toolbar. Click it again to remove the breakpoint. Text annotations do not accept breakpoints
Review or disable a breakpoint
Use Breakpoints to find marked nodes. Skip breakpoint enables or disables the selected breakpoint while preserving its location. The extension also synchronizes pipeline breakpoints with VS Code's Breakpoints view
Start the SFCC debugger
Follow the Debugging guide to select the active sandbox connection, account, and code version, then start the SFCC debug session. Keep the local pipeline and scripts aligned with the code deployed to that instance
Trigger the pipeline
Run the storefront route or job that reaches the node. When the remote debugger stops there, VS Code opens Run and Debug and the graph centres the halted node, outlines it with a red dashed frame and shows its properties. Variables lists the Pipeline Dictionary, and every Step Over moves the frame to the next node it stops on. Selecting a pipeline breakpoint in VS Code returns to its graph node
Breakpoint markers are editor/debugger state; they are not added to the deployed pipeline XML. A site scope supplies storefront context for endpoint actions, but is not a requirement for starting an otherwise configured debug session
Troubleshooting
- The file opens as raw XML: use Show Pipeline Editor or Reopen Editor With… and check that the file is under a
pipelinesdirectory - A drag on empty canvas pans instead of selecting: hold
Shiftbefore you press the mouse button - Properties closed after a Cmd-click or a selection rectangle: it shows one node at a time. Click a single node to bring it back
- The graph cannot load: open Show Pipeline Source Code, review the XML error, and correct the source before reopening the graph
- A script, template, or route is missing from completion: confirm its cartridge is linked and allow indexing to finish. Review the selected site scope if the wrong override resolves
- A graph breakpoint never pauses execution: confirm the debugger is connected to the intended instance and code version, the deployed pipeline matches your local file, and the request actually reaches that node
- An action requires plugin access: graph editing and editor actions require active Intellij SFCC access, including trial access. The source view remains available
