Visualize COBOL Programs in VS Code
VS Code extension COBOL Control Flow
Making a change in a COBOL program can be complicated. Being able to visualize the interaction and program flow enhances your ability to estimate changes, make changes, and understand what is necessary to test a change. COBOL Control Flow is an extension for Visual Studio Code that provides this graphical visualization of programs written in the COBOL Language. The extension helps COBOL developers quickly understand the flow of any COBOL program.
The benefit of the COBOL Control Flow extension is the visual aid it provides in finding the location of a particular section of a COBOL program, eliminating the need to scroll and read through multiple lines of source code. There are many options to choose from once the flow is displayed. The developer can zoom in on a particular node, see the flow from the highlighted node to the end of the program, collapse and expand nodes and view the corresponding source code.
Getting Started
COBOL control flow is a part of Code4z can be downloaded here:
https://marketplace.visualstudio.com/items?itemName=broadcomMFD.code4z-extension-pack
Once the extension is installed, COBOL Control flow is available as a menu item in the VS Code editor. Follow these steps :
- Open a COBOL file.
- Right click inside the file editor.
- The context menu opens.
- Select Generate COBOL Control Flow.
The integration with COBOL Language Support brings more precise code parsing and more importantly also support for copybooks — this way, also copybooks are displayed in the graph as a separate nodes with gray borders (regular nodes are blue).
The control flow can be created from a local COBOL file, a COBOL file in GIT, or directly from a mainframe dataset by using Zowe Explorer (a VS Code extension which is part of Code4z or separately as Zowe Explorer). From within Zowe Explorer you can access the mainframe and click on any COBOL dataset member. Note: As the program flow supports COBOL sources, VS Code must recognize the source as COBOL with the file extension of “.cbl”. Zowe Explorer handles this for you, but if the editor didn’t recognize it you can change this information bar at the bottom of the VS Code edit window.
Making sure the editor recognizes the source as COBOL
Create the control flow from a particular point in the source code
Interaction between the source and the control flow
The source in the edit window and the control flow are linked. If you click on a node in the control flow, the location in the code will be highlighted and the perspective in the edit window will move to that location. (Note: this is a great way to move around in the source quickly and easily… nicer than an outline view). As well, if you move in the source code to a location and want to see where you have navigated to in the control flow, you can create the flow from that point and the flow will highlight that node and the control flow to reach that node.
When you need to know the context of a label in the COBOL control flow means, you can hover over a node and it will display a snippet of the source without having to jump to that location in the source.
Navigating around the COBOL Control Flow
The control flow can be quite large especially with a large program.
A large COBOL program
To focus on a particular section of the COBOL control flow, you can collapse and expand nodes and the children of the node.
Expand/Contract a section of the flow
In order to see more of the flow, simply click in the graph and drag the flow right, left, up or down.
