Full Stack debugging of a wails app using vs code (running the cmd: "wails dev", the watcher) [using go delve]

debug.py

# This script will find the process id and start delve for debugging
# ${YOUR_PROCESS_NAME} = your app name, no need for the extention like .exe
# ${PORT} = the listening port for the delve server, we need this to attach the vs code debugger

import psutil
import subprocess

process = filter(lambda p: "${YOUR_PROCESS_NAME}" in p.name(), psutil.process_iter())
for i in process:
    cmd = ['dlv', '--listen=:"${PORT}"', '--headless=true', '--api-version=2', '--check-go-version=false', '--only-same-user=false', 'attach', str(i.pid)]
    subprocess.run(cmd)

Intro.md

How to debug a Wails application (golang)

In the following you will find all the configs and script to fully debug your wails application (Both the frontend and the backend) in vs code while also having live reload.

What you need

• install delve if you haven't already
• python3.x

How it works

• We first execute the wails dev command to start build the app in development mode with a watcher (for the live reload)
• using problemMatcher we get the state of the wails dev command to know when the watcher started
• as we now know that the process started, we execute the python script to get the pid of our application and we attach delve to it by starting a local server
• we again use problemMatcher to get the state of the delve to notify the vs code that it can continue and it will then attach the vs code debugger to delve

And done, happy debugging!

IMPORTANT

Change the variables ${YOUR_PROCESS_NAME} and ${PORT} in both debug.py and tasks.json

launch.json

{
    "version": "0.2.0",
    "configurations": [
      {
        "name": "Wails Debug with delve",
        "type": "go",
        "request": "attach",
        "mode": "remote",
        "preLaunchTask": "dlv-server",
        "remotePath": "${workspaceFolder}",
        "port": "${PORT}", // here goes the port you defined in the debug.py script
        "host": "127.0.0.1"
      }
    ]
  }

tasks.json

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "wails-dev",
      "type": "shell",
      "command": "wails",
      "options": {
        "cwd": "${workspaceFolder}"
      },
      "isBackground": true,
      "args": [
        "dev",
      ],
      "problemMatcher": {
        "owner": "custom",
        "pattern": {
          "regexp": "__________________"
        },
        "background": {
          "activeOnStart": true,
          "beginsPattern": ".*",
          "endsPattern": "To develop in the browser and call your bound Go methods from Javascript, navigate to: *"
        }
      }
    },
    {
      "label": "dlv-server",
      "type": "shell",
      "command": "python.exe",
      "options": {
        "cwd": "${workspaceFolder}"
      },
      "isBackground": true,
      "problemMatcher": {
        "owner": "custom",
        "pattern": {
          "regexp": "__________________"
        },
        "background": {
          "activeOnStart": true,
          "beginsPattern": ".*",
          "endsPattern": "API server listening at: *"
        }
      },
      "args": [
        "debug.py",
      ],
      "dependsOn": [
        "wails-dev"
      ]
    },
  ]
}