Debug Web3 React Application using VScode - visual-studio-code

I am using VSC:
Version: 1.65.2
Commit: c722ca6c7eed3d7987c0d5c3df5c45f6b15e77d1
Date: 2022-03-10T15:36:26.048Z
Electron: 13.5.2
Chromium: 91.0.4472.164
Node.js: 14.16.0
V8: 9.1.269.39-electron.0
OS: Linux x64 5.13.0-35-generic snap
I want to debug my react application that uses web3 to connect to ethereum blockchain.
I created the following launch.json:
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "pwa-chrome",
"request": "launch",
"name": "Debug React ",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}
When I start my application with npm run start it runs correctly in my chrome browser, where metamask is installed.
However, when pressing the debug launch config a new emtpy chrome window starts, that has no metamask tooling installed, like the following:
Any suggestions how to start my installed chrome browser?
I appreciate your replies!

Related

VS Code Python debugging justMyCode=False does not allow to step into external code

By debugging a Python code in VS Code I want to step into routines of matplotlib package.
By right mouse click I can open the code definition in the package source code, but I cannot step into it during debugging.
I use the newest VS Code with Pylance and Python extensions from Microsoft:
Version: 1.74.2 (system setup)
Commit: e8a3071ea4344d9d48ef8a4df2c097372b0c5161
Date: 2022-12-20T10:29:14.590Z
Electron: 19.1.8
Chromium: 102.0.5005.167
Node.js: 16.14.2
V8: 10.2.154.15-electron.0
OS: Windows_NT x64 10.0.18363
Sandboxed: No
Python 3.10.5 64-bit
Following several hints on Stack overflow I created a launch.json file in the workspace.vscode program directory and added a new configuration:
{
"name": "Debug Unit Test",
"type": "python",
"request": "test",
"justMyCode": false
}
I expected that upon debugging using the new configuration "Debug Unit Test" I can then step into external code, but it was not the case.
Actually, the "test" value in "request" tag is marked as not accepted. I also tried "launch" there, but it also did not help.
Following another hint I also tried
{
"name": "Debug Unit Test",
"type": "python",
"request": "launch",
"debugOptions": ["DebugStdLib"],
"justMyCode": false
}
The "debugOptions" property is however, not allowed.
I also searched for justMyCode parameter in VS Code settings and found only for Jupyter extension, not for Python.
Is it possible that VS Code discontinued this option for Python debugging??
Looking at the documentation it appears you need to add the following configuration:
{
"name": "Python: Debug Tests",
"type": "python",
"request": "launch",
"program": "${file}",
"purpose": ["debug-test"],
"console": "integratedTerminal",
"justMyCode": false
}
I had the same issue but after adding the above to my launch.json I could step into code other than my own.
https://code.visualstudio.com/docs/python/testing#_debug-tests

Can't debug Rust code inside vscode with WSL setup

I can't debug my rust code which is in WSL with VScode which is installed on my windows. I get these errors during debug.
Error: there is no registered task type 'codelldb.cargo'. Did you miss installing an extension that provides a corresponding task provider?
Error: there is no registered task type 'codelldb.cargo'. Did you miss installing an extension that provides a corresponding task provider?
Here is my launch.json
{
"version": "0.2.0",
"configurations": [
{
"type": "lldb",
"request": "launch",
"name": "Debug executable 'foo'",
"cargo": {
"args": [
"build",
"--bin=foo",
"--package=foo"
],
"filter": {
"name": "foo",
"kind": "bin"
}
},
"args": [],
"cwd": "${workspaceFolder}"
},
]
}
Strangely I can run my code using vscode & getting expected output.
I have installed below extension for WSL in vscode
codeLLDB
rust-analyzer
these are the versions of software
WSL: version 1
vscode: 1.72.2
windows : Windows 10
What I'm missing here
This issue is due to WSL version. Issue got fixed after upgrading WSL from v1 to v2

Debugging with Visual Studio Code to WSL2 remotely then using a virtual Conda environment

I stumbled upon an issue while i try to use the VS Code to remote debug WSL2 that is using an Conda virtual environment. When i use the 'base' version of Conda the debugger starts properly. But for the virtual environment it just kinda "blinks" with the debug bar and then stops.
GIF Sequence of the issue here i start with the virtual environment then switch to the base
This is my launch.json file.
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Python: Module",
"type": "python",
"request": "launch",
"module": "run",
"justMyCode":true,
"env": { "PYTHONPATH": "${PYTHONPATH}:/home/marten/rl/go-explore/robustified"}
}
]
}

Can't run debugging in Visual Studio Code on Chrome OS

How do I run a .html file in VS Code on Chrome OS? It sais I need to add the absolute path to browser in a Json file.
Trying to open a .html file in VS Code on Chrome OS
U need to install a separate version of Chrome on VS Code then it will work. I just had the same problem and found the solution somewhere hidden on Reddit, but it worked :-)
sudo apt install chromium
Then you can add this to your .vscode/launch.json
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"runtimeExecutable": "/usr/bin/chromium",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}",
"smartStep": true
}
]

Configured debug type 'hl' not supported

I have installed hash link on my linux machine (works on the terminal as expected) and upon pressing F5 from vscode for my heaps.io program, it says Configured debug type 'hl' not supported. So I tried searching for hashlink on the extensions market and found no results. I have copied my launch.json from the heaps.io tutorial website. What should I do?
Launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "HashLink",
"request": "launch",
"type": "hl",
"cwd": "${workspaceFolder}",
"preLaunchTask": {
"type": "haxe",
"args": "active configuration"
}
}
]
}
Where the launch.json file can be found
https://heaps.io/documentation/hello-hashlink.html
Ok I made it work! For some reason I had to copy all the required libraries from /usr/local/lib to /lib64 for vscode to launch my application through hashlink.
Also about the hashlink, I just installed the .vsix version of hashlink of version 1.1.12. The versions above that don't seem to work with the latest vscode version.