Launching Chrome without web-securities in VS Code - vscode-extensions

How can I configure the Chrome Browser without web-security in launch.json file in VS Code? I installed the VS Code extension Debugger for Chrome and my launch.json seems so:
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome",
"url": "http://localhost:8100/",
"webRoot": "${workspaceRoot}"
}
]
}
This code launch Chrome with web-securities. How can I configure this file so that I can launch Chrome with this parameter: chrome.exe --user-data-dir="C://Chrome dev session" --disable-web-security

just add
"runtimeArgs": [
"--disable-web-security"
],
So your launch.json will look like:
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome",
"url": "http://localhost:8100/",
"runtimeArgs": [
"--disable-web-security"
],
"webRoot": "${workspaceRoot}"
}
]
}

Related

How to configure launch.json in Visual Studio Code to debug VueJS Project with Chrome and put bound breakpoints?

I'm currently working in a symfony/VueJS project. I would like to debug the VueJs part with VSCode and Chrome. When I put a breakpoint on a line of vuejs code after launching the chrome debuging VSCode says the breakpoint is unbound. My VueJS code path is in assets/js.
I configured the .vscode/launch.json as follows and try many configurations, but I got "unbound breakoints" after launching the chrome debuging :
{
"name": "WSL Chrome",
"type": "chrome",
"request": "launch",
"url": "http://localhost:8003/login",
"webRoot": "${workspaceFolder}",
"sourceMap": true,
"sourceMapPathOverrides": {
"webpack:///src/*": "${webRoot}/*"
}
},
Have you some ideas ?
Regards
Lamiel
Try the following configuration in your launch.json file
{
"configurations": [
{
"name": "Launch Chrome",
"request": "launch",
"type": "chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/src",
"breakOnLoad": true,
"sourceMapPathOverrides": {
"webpack:///./src/*": "${webRoot}/*",
"webpack:///src/*": "${webRoot}/*",
}
}
]
}
Also add the the following vue.config.js file to the root directory of the project
module.exports = {
configureWebpack: {
devtool: 'source-map'
}
}

Define vscode variables

Is there a way to define variables in vscode for use in launch.json?, I only want some variable that will be common to different configurations, let's say TESTING_USER="ABC"
{
"version": "0.2.0",
// it would be ideal to set it here somehow,
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Node",
"runtimeArgs": ["idUser", "${TESTING_USER}"],
},
{
"type": "chrome",
"request": "launch",
"name": "Chrome",
"url": "http://localhost:3000?${TESTING_USER}",
}
],
}
The only solution I've found would be creating an entry in settings.json and then referring it with ${config:xxxx} but I wonder if there's a more direct way.
You can use the extension Command Variable and use a file with key-value pairs
Another possibility is to use the command: extension.commandvariable.transform
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Node",
"runtimeArgs": ["idUser", "${input:TESTING_USER}"],
},
{
"type": "chrome",
"request": "launch",
"name": "Chrome",
"url": "http://localhost:3000?${input:TESTING_USER}",
}
],
"inputs": [
{
"id": "TESTING_USER",
"type": "command",
"command": "extension.commandvariable.transform",
"args": { "text": "ABC" }
}
]
}

How to configure Mocha with VS Code

Hi I'm trying to setup Mocka and Chai frameworks with Visual Studio Code but I'm getting error when I'm trying to run mocha unit test saying:
Attribute 'program' does not exist ('C:\Users...node_modules/mocha/bin/_mocha')
http://prikachi.com/images/321/9672321w.png
It must be something from the settings.
This is the JSON config file of VS Code 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": "node",
"request": "launch",
"name": "Mocha Tests",
"program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
"args": [
"-u",
"bdd",
"--timeout",
"999999",
"--colors",
"${file}"
],
"internalConsoleOptions": "openOnSessionStart"
},
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${file}"
}
]
}

Can't run or debug react native

I am using Visual Code, and just created an react native app through create-react-app NewTest
I already installed React Native Tools in vscode
The app is running just fine in my android device through Expo installed on it. The problem is that I can't run it on my simulator which is genymotion mobile
I get this error:
[Error] Error: Unknown error: not all success patterns were matched
My 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": [
{
"name": ".NET Core Attach",
"type": "coreclr",
"request": "attach",
"processId": "${command:pickProcess}"
},
{
"name": "Debug Android",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "android",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
},
{
"name": "Debug iOS",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "ios",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
},
{
"name": "Attach to packager",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "attach",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
},
{
"name": "Debug in Exponent",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "exponent",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
}
]
}
I just started the getting started tutorial and I have no idea about why it is not working. I already search over the internet and could not find much help.
Genymotion device
Error image

Debug React Native app on iPhone with VSCode

I have VSCode installed on Ubuntu with React Native Tools 0.4.1 installed. I can't figure out how to use debug with it. Tried to follow this tutorial with no luck - it just stacks on loading and nothing happens.
My launch.json is created automatically and looks like this:
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug Android",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "android",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
},
{
"name": "Debug iOS",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "ios",
"target": "iPhone 5s",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
},
{
"name": "Attach to packager",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "attach",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
},
{
"name": "Debug in Exponent",
"program": "${workspaceRoot}/.vscode/launchReactNative.js",
"type": "reactnative",
"request": "launch",
"platform": "exponent",
"sourceMaps": true,
"outDir": "${workspaceRoot}/.vscode/.react"
}
]
}