How Does Live Debugging Enhance the VS Code Developer Experience?

The method of live debugging represents the latest advancements in software development processes, revolutionizing how developers identify and resolve issues in real time. It is a dynamic approach to gaining instant insights and continuously monitoring a software program without halting its execution, resulting in faster issue resolution and improved code quality.

This article explores various VS Code (Visual Studio Code) native debugging capabilities and steps to upgrade the IDE for live debugging, including a quick demonstration using a sample Python program.

VS Code Native Debugging Capabilities

VS Code is one of the most popular integrated development environments (IDE) among the developer community. It can act as a code editor and transform into a full-fledged IDE with the help of extensions. VS Code also has a web version. As a result, it offers a lot of flexibility and supports integrations with Git and other development tools.

The VS Code IDE offers quite a few debugging facilities:

1. Built-in debugger — VS Code’s built-in debugger supports Node.js runtime and can debug JavaScript, TypeScript, or any other language transpiled to JavaScript.
2. Debugger extensions — Debugger extensions for other programming languages, such as Python, PHP, Go, and others, can be downloaded from the VS Code marketplace.
3. Remote debugging — Developers using VS Code can use the Visual Studio Code Server to securely connect to a remote development machine, access files and directories, run applications, and perform debugging.
4. Co-Debugging — VS Code supports a Live Share extension for developers to edit and debug their source code collaboratively. Developers work from the comfort of their VS Code theme and join a debugging session initiated by another developer to share terminal instances, forward localhost web apps, make voice calls, and more.

Despite its rich debugging capabilities, VS Code does not support live debugging. All the native debugging capabilities of VS Code follow the traditional debugging practices of static analysis and breakpoints, interrupting program execution to examine code. However, given the complexity and scale of modern cloud-native applications, live debugging promises greater efficiency, accuracy, and agility in software development processes.

Let’s learn more about how to upgrade VS Code with live debugging capabilities.

Integrating Live Debugging in VS Code

Live debugging has a positive impact on cultivating a culture of continuous improvement and excellence in software engineering practices. Lightrun is committed to this cause and helps developers and software engineering teams embrace this paradigm shift in debugging through its developer observability platform.

The Lightrun platform offers a cloud-agnostic way for developers to perform live debugging on running applications deployed on bare-metal servers, inside Kubernetes clusters, Docker containers, or serverless functions. Lightrun is compatible with VS Code and is available via the VS Code marketplace.

To integrate with VS Code, you must obtain a license either through connecting with Lightrun using this link, or simply through the AWS Marketplace. Thereafter, follow these documentation steps to install the Lightrun plugin within your VS Code IDE environment and authenticate with your Lightrun credentials to activate the plugin.

As you will soon experience, the Lightrun panel is activated within the VS Code IDE when a program embedded with the Lightrun agent is executed.

If you want to see it in action before experiencing it yourself, here is a quick tour of the Lightrun plugin-activated view of VS Code.

Live Debugging Python Demo: “Hello Bug”

Let’s use a Python program (with Python 3.9) to experience how Lightrun’s live debugging capabilities can improve the VS Code developer experience.

Here is the sample Python program.

try:
  import lightrun
  lightrun.enable(
      company_key='<LIGHTRUN_COMPANY_KEY>',
      com_lightrun_server='https://app.lightrun.com/')
except ImportError as e:
      print("Error importing Lightrun: ", e)

master_string = ""

def append_string(input_string):
    global master_string
    master_string += input_string + " "


def handle_exception(e):
    print(e)

def main():
       
    while True:
        try:
            user_input = input("\nEnter a string: ")

            if user_input.lower() == "exit":
                print("Exiting the program.")
                break
            elif user_input.lower() == "view":
                print("Master string:", master_string)
            elif user_input.isdigit():
                raise ValueError("Hello Bug!!")
            else:
                append_string(user_input)
                print("String appended to master string successfully!")
        except ValueError as ve:
            handle_exception(ve)
            continue
        except Exception as e:
            print("An error occurred:", e)
            continue

if __name__ == "__main__":
    print("Welcome to the String Appender Game!")
    print("Type 'exit' to quit the game.")
    print("Type 'view' to view the current master string.")
    main()

This program runs an infinite loop. In every iteration, it accepts an input string from the keyboard and appends it to a master string. Two input strings, ‘view’ and ‘exit,’ are reserved to view the current value of the master string and to exit the program. Additionally, this code also checks if the input string is numeric and raises an exception for that.

Notice that the Lightrun agent is imported at the top of the source code. This is done to facilitate live debugging within the Python runtime. The agent initialization uses a unique company key associated with your Lightrun account. For more information, check the Python agent installation guide to learn how to install the Python module for the Lightrun agent and the supported Python versions.

Suppose you want to follow along this article and test this code yourself. In that case, you must replace the placeholder <LIGHTRUN_COMPANY_KEY> with your Lightrun account specific key, per the instructions in the documentation.

Let’s execute this program’s source code in the VS Code terminal and see how it behaves in runtime.

As you can see, the input strings’ lightrun’, ‘live’, and ‘debugging’ are appended to the master string. But ‘123’ is not appended since it is numeric. Moreover, the displayed log message “Hello Bug!!” does not indicate the reasons for the exception. In many cases, developers are greeted with bugs containing such cryptic or confusing error messages, which adds to the difficulty of debugging.

Let’s rerun this program. This time, we will leverage Lightrun and add a dynamic log and a snapshot to analyze the exception.

In the above demonstration, a dynamic log is added in line 13 to capture the input string, and a snapshot is added in line 17 when the exception is handled. These are the Lightrun specific debugging actions that inject live instrumentation within the source code of the running program. With the Lightrun debugging actions added, let’s follow the same sequence of entering the input strings.

With the addition of a dynamic log, you can see the Lightrun induced log message in the console every time an input string is appended. And when the exception is encountered due to a numeric string, the current stack’s snapshot is captured. By unrolling the stack, you can see the numeric string value that caused this exception.

Since this program is elementary, you can instantly debug this issue. But consider real world applications extending to tens of thousands of lines of code. In such cases, the ability to inject a log or snapshot anywhere in the code is a super time saver. Most importantly, this is achieved without halting the program execution, modifying the source code, or leaving the IDE. It is a real boon for developer productivity.

So now you have an upgraded VS Code IDE setup with live debugging capabilities powered by Lightrun. As you have witnessed, it can single-handedly replace all the other debugging facilities and enrich the developer experience.

Experience the Lightrun Live Debugging

Apart from VS Code, Lightrun also supports IntelliJ, PyCharm, and VS Code.dev, the web version of the VS Code IDE. In terms of programming languages, Lightrun is readily supported for Java, Node.js, .NET and Python, with more in the making.

Sign up to get your personal demo now and witness the next-generation developer observability in action through live debugging.

👋 If you find this helpful, please click the clap 👏 button below a few times to show your support for the author 👇

🚀Join FAUN Developer Community & Get Similar Stories in your Inbox Each Week