Flutter: add flavors configuration into Visual Studio - flutter

My flutter application has different flavors.
In Android Studio everything is setup in the flavor configuration panel, but where can I do that in Visual Studio Code?
I guess I have to edit the configuration.json but I cant find any reference online on how to do it.
I do not want every time to type flutter run --flavor app1 -t lib/main_app1.dart

You can pass additional arguments using a launch.json. If you don't already have one, click the Cog icon in the Debug sidebar and then select Flutter in the snippet-completion list. You can then add an args section, like this:
{
"name": "Flutter",
"request": "launch",
"type": "flutter",
"args": [
"--flavor",
"app1"
]
}

You have to edit your launch.json file
{
"name": "dev", // you can add nickname for it
"request": "launch",
"type": "dart",
"args": [
"--flavor", //flavor name
"dev",
"-t", // if your have different main file
"lib/main_dev.dart"
]
},

{
"name": "App Dev",
"cwd": ".",
"request": "launch",
"type": "dart",
"flutterMode": "debug",
"program": "lib/main_dev.dart",
"args": ["--flavor", "dev"],
}

Related

Debug current open Flutter file in VSCode

I am writing a Flutter tutorial project in VS Code with multiple main() functions.
For example:
main.dart //Contains a main() function
step1.dart //Contains a main() function
step2.dart //Contains a main() function
If I have step1.dart open, then pressing F5 runs main.dart and not step1.dart in debug mode.
I can hover the mouse over the main() function in step1.dart, and then select 'debug' from the context menu. This works as expected and runs step1.dart in debug. However, there is no associated shortcut.
What can I press to run the active open file in debug mode, not main.dart?
As long as I have experience of having multiple flutter projects on a workspace (not too good feedback at all), the key is to set the pre-build process configuration file .vscode/launch.json, you can get more info on debugging#_launch-configurations.
When you create the file, it will look something like:
{
"version": "0.2.0",
"configurations": [
{
"name": "Flutter",
"request": "launch",
"type": "dart",
}
]
}
Then add "program": "lib/your-entry-point.dart":
{
"version": "0.2.0",
"configurations": [
{
"name": "main",
"request": "launch",
"type": "dart",
"program": "lib/main.dart"
},{
"name": "step1",
"request": "launch",
"type": "dart",
"program": "lib/step1.dart"
},{
"name": "step2",
"request": "launch",
"type": "dart",
"program": "lib/step2.dart"
}
]
}
This will then create the following launch options.
I made this launch.json file in the .vscode folder.
Worked like a charm.
{
"version": "0.2.0",
"configurations": [
{
"name": "Dart: Current File",
"type": "dart",
"request": "launch",
"program": "${file}",
"cwd": "${fileDirname}"
},
]
}
Here are the variables you can use in launch.json.
https://code.visualstudio.com/docs/editor/variables-reference

Is it possible to launch a vscode extension with a set of custom settings?

I'm developing a vscode extension, and while testing it out I've hit a bit of a snag. Some functionality depends on custom settings that I define in the configuration of package.json. I would like to be able to launch a new VSCode window with the settings set to particular values, but I can't find how to do that.
What I have in launch.json:
{
"version": "0.2.0",
"configurations": [
{
"name": "Extension",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": [
"--disable-extensions",
"--extensionDevelopmentPath=${workspaceRoot}"
],
"ns.customSetting": "customValue"
},
{
"name": "Extension with another value",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": [
"--disable-extensions",
"--extensionDevelopmentPath=${workspaceRoot}"
],
"ns.customSetting": "anotherValue"
}
]
}
That hasn't been working, but hopefully the idea is clear. I want that new window to open with the custom setting already set to the value I want. How do I do that?

VSCode and flutter, how to connect multiple devices?

I am using Visual Studio Code on macOS for developing Flutter apps.
I can select a single device in the bottom-left of VSC. I can also run on multiple devices using flutter run -d all. I am wondering how I can run on multiple devices using the debug console in VSC. Or, at the very least, debug one device but show updates on all.
Thank you
If you're on recent versions of Flutter and the Dart/Flutter extensions (Dec 2019 onwards) this is now supported using VS Code's compound launch configurations.
Your .vscode/launch.json should contain an entry for each device, along with its deviceId (this is the ID you would pass to flutter run -d xxx):
{
"version": "0.2.0",
"configurations": [
{
"name": "Current Device",
"request": "launch",
"type": "dart"
},
{
"name": "Android",
"request": "launch",
"type": "dart",
"deviceId": "android"
},
{
"name": "iPhone",
"request": "launch",
"type": "dart",
"deviceId": "iphone"
},
],
"compounds": [
{
"name": "All Devices",
"configurations": ["Android", "iPhone"],
}
]
}
For more information, see https://github.com/flutter/flutter/wiki/Multi-device-debugging-in-VS-Code.
How about this one, it worked for me
flutter run -d all
well you can run only two devices or two virtual machine at the same time
one using command flutter run -d <put the id of the device>
and the other using f5 and choose the other device
In Flutter 1.12 support multi device debugging in VS Code
https://github.com/flutter/flutter/wiki/Multi-device-debugging-in-VS-Code
If you have different flavors, you can configure your launch.json config as follows.
{
"version": "0.2.0",
"configurations": [
// config "Run Dev Android" and "Run Dev Iphone" will be user for multiple debuging,
{
"name": "Run Dev Android",
"request": "launch",
"deviceId": "SM",
"type": "dart",
"program": "lib/app/flavors/main_development.dart",
"flutterMode": "debug",
"args": [
"--flavor", "development",
]
},
{
"name": "Run Dev Iphone",
"flutterMode": "debug",
"deviceId": "Iphone",
"program": "lib/app/flavors/main_development.dart",
"type": "dart",
"args": [
"--flavor", "development",
]
},
{
"name": "Run Dev",
"program": "lib/app/flavors/main_development.dart",
"flutterMode": "debug",
"deviceId": "Android",
"type": "dart",
"args": [
"--flavor", "development",
]
},
{
"name": "Run Stage",
"program": "lib/app/flavors/main_staging.dart",
"flutterMode": "debug",
"type": "dart",
"args": [
"--flavor", "staging"
]
},
{
"name": "Run Prod",
"program": "lib/app/flavors/main_development.dart",
"flutterMode": "release",
"type": "dart",
"args": [
"--flavor", "production"
]
},
],
"compounds": [{
"name": "All Devices",
"configurations": ["Run Dev Android", "Run Dev Iphone"],
}]
}
Now you can select the All Device and hit run.

How to debug Cucumber in Visual Studio Code (VSCode)?

I was trying to debug Cucumber scenarios in Visual Studio code and made below changes in the launch.json.
{
"name": "e2e",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}\\node_modules\\.bin\\cucumber-js",
"stopOnEntry": false,
"args": ["--no-timeouts", "--colors"],
"cwd": "${workspaceRoot}",
"runtimeExecutable": null,
"outFiles": [
"${workspaceRoot}\\features\\step_definitions\\*.js"
]
},
However, I am not able run a debug session using the above configuration. The step def. files I created in JavaScript.
So, just need a help on the script above if that looks fine?
You could try below configuration to make your debug working in VS Code. In the outFiles give your feature file path.
{
"name": "e2e",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/cucumber/bin/cucumber.js",
"outFiles": [
"${workspaceRoot}/features/*.feature"
]
}
============================================
UPDATE AS OF cucumber ^5.0.2:
{
"name": "NPM Cukes",
"type": "node",
"request": "launch",
"console": "integratedTerminal",
"program": "${workspaceRoot}/node_modules/cucumber/bin/cucumber-js",
"args": [
"path/to/features/**/*.feature",
"-r",
"path/to/steps/**/*",
"--tags",
"#your-tags"
]
}
If you want to debug only CURRENT feature, add this to launch.json
{
"type": "node",
"request": "launch",
"program": "${workspaceFolder}/node_modules/.bin/cucumber-js",
"args": ["${relativeFile}"],
"name": "Cukes current",
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"windows": {
"program": "${workspaceFolder}/node_modules/cucumber/bin/cucumber"
}
}
When working with Ruby, it could be used on this way to run specific feature files:
{
"name": "Cucumber",
"type": "Ruby",
"request": "launch",
"cwd": "${workspaceRoot}",
"program": "${workspaceRoot}/bin/cucumber",
"args": [
"--tags", "#Mytags",
]
}
Tweaking the answer from Mukesh Rawat plus ensuring additional file paths were correct, got it working for me, :
Launch.json
{
"name": "DebugMode",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/cucumber/bin/cucumber-js",
"args": [
"${workspaceRoot}/features/*.feature",
"--tags", "#debug"
]
}
Workspace.json
{
"cucumberautocomplete.steps": [
"features/steps/*.js"
],
"cucumberautocomplete.syncfeatures": "features/*.feature",
"cucumberautocomplete.strictGherkinCompletion": true,
"settings": {},
"folders": [
{
"path": "/Users/{me}/Documents/{project folder}/{project name}"
}
]
}
Package.json
"scripts": {
"debug": "node --inspect=1337 --debug-brk --nolazy node_modules/cucumber/bin/cucumber-js --tags #debug --format json:./reports/report.json",
CucumberTest.feature
#debug
Scenario: Validate I can get debug working
This works
{
"name": "DebugMode",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/cucumber/bin/cucumber-js",
"args": [
"${workspaceRoot}/features/*.feature",
"--tags", "#debug"
]
}
Here's the simplest way I've found to run Cucumber.js in the VS Code debugger:
Set JavaScript debugger auto attach to "onlyWithFlag" (Ctrl+Shift+P, type "Toggle Auto Attach")
Run Cucumber.js as follows: node --inspect ./node_modules/.bin/cucumber-js <args...>
For convenience, set an NPM run script in your test project for "debug" so you can run this as npm run debug -- <args...>
with the latest Cucumber, Playwright, typescript as of January 2023 - F5 (run in VSCode) - set debugger in ts step files and use .vscode/launch.json (you might tweak your reports location)
{
"version": "0.1.0",
"configurations": [
{
"name": "debugMode",
"type": "node",
"request": "launch",
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"program": "node_modules/#cucumber/cucumber/bin/cucumber-js",
"args": [
"./features/*.feature",
"--require-module",
"ts-node/register",
"--require",
"./steps/*.steps.ts",
"--tags",
"#demoX",
"--format", "progress",
"--format", "json:./Reports/cucumber_report.json"
]
}
]
}

Running two projects at once in Visual Studio Code

I develop web project. Server is node.js application written in TypeScript. Client also written in Typescript. I need two ability:
to compile different projects with different compiler options in different folders.
to debug both projects at the same time.
How can I do this?
See our documentation on multitarget debugging: https://code.visualstudio.com/Docs/editor/debugging#_multitarget-debugging
In your launch.json, just create a compounds section that contains the targets you want to debug
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Server",
"program": "${workspaceRoot}/server.js",
"cwd": "${workspaceRoot}"
},
{
"type": "node",
"request": "launch",
"name": "Client",
"program": "${workspaceRoot}/client.js",
"cwd": "${workspaceRoot}"
}
],
"compounds": [
{
"name": "Server/Client",
"configurations": ["Server", "Client"]
}
]
}