With a debugger configured correctly, it is possible to step through the Simpack Javascript code which is a great aid in finding and fixing issues.
Configuring the debugger for the first time in a project
- Open VS Code
- Open the top-level folder of the project of where you are working
VS Code will generate a hidden folder called ‘.vscode’ where the project settings are saved. - Start your favourite command line tool, either integrated in VS Code or separate
Start a simpack script with the argument ‘--debug‘/'-d' before the argument ‘--script’/'-s'
If ‘--debug’ appears after the ‘--script’ argument then it will be passed to the script as an argument.
- When the following message appears, press ‘F5’ in VS Code to start the debugger
Debugger listening on ws://127.0.0.1:9229/3967454e… For help, see: https://nodejs.org/en/docs/inspector
Select Node.js as the debugger
- After selecting the debugger, a number of options appear in the side bar. Before first use it is necessary to create a launch.json file, which is done clicking the hyperlink
- After pressing the hyperlink, it is necessary to select ‘Node.js’ again before an initial ‘launch.json’ file is opened in a new editor
- As we would like to attach the debugger to a program running on the localhost, then the launch.json file needs to be updated as follows
- Now that the configuration of the debugger is complete it is necessary to start the debugger by pressing ‘F5’
Starting Debugger when a launch.json exists
- Start a simpack script with the argument ‘--debug‘ before the argument ‘-s’
- When the following message appears, press ‘F5’ in VS Code to start the debugger
Debugger listening on ws://127.0.0.1:9229/3967454e… For help, see: https://nodejs.org/en/docs/inspector
- If preferred it is also possible to get the debugger to automatically attach when a Simpack script is started. From within VS Code, press « ctrl + Shift + P » and select 'Toggle Auto Attach'
Additional code automatically added to SJS files
After starting the debugger by pressing ‘F5’, a modified read-only version of your Simpack script is opened with the cursor at the beginning of the executable code. So that Simpack scripts that contain a main function execute as expected, it is necessary for Simpack to automatically add some code to make sure that the main function is called - the passed parameters and any returned error code are then handled correctly.
The added code can be ignored, but this modified file is only shown as a preview and therefore cannot be edited.
Debugging Simpack scripts with VS Code
Once the debugger is attached to your script then the following steps can be used to navigate through the code.
- Select ‘run to cursor’ from the context menu at the beginning of the section to be debugged.
- Set breakpoints in the code using ‘F9’
- Step through the code using ‘F10’.
- Step into functions using ‘F11’
- After stopping at a breakpoint, continue running the code with ‘F5’
- Hoovering over a variable will show you the variables current value
- Variables, including objects, can also be seen in the side bar
- By switching to the debug console, it is possible to modify values
- The debug console also allows you to ‘test’ code or inspect variables easily
