I'm learning Flutter and using Android Studio as my IDE and i've hit some pain points around Integration Testing.
As part of the learning process i have written a basic Integration Test.
The intention with this integration test is to examine an Image widget (created via Image.Asset) to see if the image source, which is dynamically generated, is the expected value, or that an image is being displayed.
I run the integration test using the Terminal tab in the IDE, e.g: flutter drive --target=my_app/test_driver/user_list_scrolling.dart
I want to add a breakpoint to my Integration Test method and step through it from within Android Studio to help aid my learning of the testing functions.
My questions are:
How can i debug an integration test from within Android Studio? - As I'm learning i would love to put a breakpoint in my integration test and play around with the Finders in the immediate window. However, when i start my integration test from the terminal my Breakpoints seem to be ignored, i also tried adding the Debugger(); command. Execution paused, but i was unable to step through my code in Android Studio. I've also tried using the 'Attach to process' option in the IDE but the 'Choose process' list is empty.
Can i execute an integration test from within Android Studio without having to manually enter a command into a terminal? - i would rather click a button than memorise a command. Right-clicking my integration test file and selecting run does not appear to work.
How can i effectively test an Image widget from within an Integration Test? - The image source is set by calling Image.Asset() with a calculated value as the first argument, so i want to confirm that an image is displayed / the argument is the expected value. I'm guessing i need to use find.byType("Image") and somehow examine the result for the source value?
The following are the steps I took to set-up for integration test development using Flutter tooling, including debugging:
Configure the app to listen on a shared port (in this case 8888)
Add ‘— observatory-port 8888’ to ‘Additional Arguments’
Configure integration test to connect on the same shared port
Add ‘VM_SERVICE_URL=http://127.0.0.1:8888/’ to ‘Environment Variables’
Start the app in run or debug-mode (only required once, with hot-reload when needed):
Start the integration test in run or debug mode (as many times as you want):
You can now add breakpoints to the app and/or test and view source code and variables in debugger.
The following describes how to setup Android Studio to develop integration tests in more detail.
A how-to for fast integration test development with existing tooling
For some reason in Android Studio the icon to run in debug mode doesn't work with configurations scoped to entire directories. Create a configuration targeting one file, or simply click the "Run Test" icon in the gutter next to your main() function and select the "Debug" option.
With the new integration_test package you can just run flutter run integartion_test/app_test.dart to debug your tests.
My launch.json (I'm using VS Code):
{
"version": "0.2.0",
"configurations": [
{
"name": "Integration Test",
"request": "launch",
"type": "dart",
"program": "example/integration_test/app_test.dart",
},
]
}
You can run then the integration test from the AndroidStudio as you would run any other Flutter app (right-click on the file, run -> debug).
Sometimes the AndroidStudio identifies the file as Dart and not Flutter, so you have to create a new Run/Debug configuration for Flutter instead. At "Dart entrypoint", select the integration file with the "main" func.
Related
Using .NET Core on a Mac with Visual Studio Code, I'm trying to host an Azure Function locally, and attach the debugger to it.
Manually, I can get it to work by starting the function with func host start, followed by pressing the debug button in the IDE, which runs the default launch.json file. This let's me pick a process to attach the debugger to because of the line "processId": "${command:pickProcess}".
I would like to automize this flow, triggering it with a simple click on the debug button in VSCode.
In the above picture I attempt to solve this by running a preLaunchTask before attaching the debugger. This task should host and start the function - which it does so successfully when isolated from the flow.
However, when I hit the Debug button with the above configuration, VSCode lets me pick a process immediately before actually having completed the preLaunchTask and so the process func is not yet available.
Is my line of thinking in order?
What could I be missing in order for this to work?
You might try to create the local Functions app with the Visual Studio Code Functions extension. When you created the Functions app with the extension, it automatically adds a VS Code launch configuration to your project which at least works on my machine :-).
One difference between my and your configuration is the processId which you might change to this:
"processId": "${command:azureFunctions.pickProcess}"
The VSCode Function extension works like a charm, the problem is that the team already started on this solution in Visual Studio Windows and so I have to adapt to that.
I did not notice the azureFunctions part in the launch configuration that comes with the extension though!
I edited my launch.json to the following:
{
"name": "Attach to .NET Functions",
"type": "coreclr",
"request": "attach",
"processId": "${command:azureFunctions.pickProcess}"
}
which seemed to do the trick! Notice that there's no preLaunchTask anymore. However, the host gets started, and the debugger gets attached!
Thanks #MartinBrandl !
I wrote a Flutter Widget plugin with user interface automated testing using Android Studio based on Flutter documentation.
Tests execute properly but are quite abstract to write without following what happens on the device UI. All I see is that the test executes properly and the duration. The device is plugged and works properly but shows nothing related to the tests.
Is there a way to execute the UI tests from Android Studio and follow the execution on the device UI to simplify the writing of UI tests?
I would like to avoid using a solution based on screenshots as it would not be convenient to have to continuously open an image to follow what is happening.
As explained in the Flutter documentation, there are 3 types of tests:
Unit
Widget
Integration
Integration testing is the one that allows following the test execution on a device or a simulator.
I recently installed NodeJS Tools for Visual Studio which touts support for Node environments in VS. Notably, it has the ability to set debug breakpoints from the IDE.
It's unclear to me if it is possible to set breakpoints when debugging Gulp tasks. The Task Runner has the ability to detect the Gulp task and output console.log statements to a window, but I haven't found a better means of debugging.
I found this post from a while back: How can I debug gulpfile.js when running it with Visual Studio Task Runner Explorer? However, this post doesn't involve NodeJS Tools for VS. So, I'm re-asking the question to take that plugin into consideration.
You can. Right-click the Node project, select Properties, and configure your app as follows (in the image, default is the Gulp task that you want to run).
Alternative method:
In a terminal, and in the directory where the gulpfile is, run node --debug=44331 --debug-brk ../node_modules/gulp/bin/gulp.js default. In my case, default is the task name I want to run/debug.
In Visual Studio, go to Debug | Attach to Process. Select Node.js Remote debugging as Transport, and in the qualifier select localhost:44331. Press enter and you should see the Node process appear in the list. Click Attach.
Voila, the breakpoints are hit.
A couple of things to notice:
If you get something like Unable to attach to process. Error 0x80004005 use a different port. I couldn't get it to work with port 5858.
It may not work the first time you attach to the process (see my previous screenshot how I got ECANCELED?). Try again.
The project setup, is a basic express application, generated with express-generator.
The project, vscode-debugging-node is available at GitHub
Please refer the screencast at Visual studio Code - Debugging node application
The Gruntfile.js in root of the project, manages the dev process. The purpose of the Gruntfile.js is simple, it starts the server and watches for any file changes.
On detecting changes in the desired file(s), it restarts the server (kills the existing process and starts a new one).
The Gruntfile.js uses ./task/server.js to start/restart the server.
The Gruntfile.js is developed in this manner, that later on, it will incorporate cookie management, in order to provide a logged in experience.
While executing the $ grunt start task, if a env variable named NODE_INSPECTOR=* is passed, the server is started in --debug mode.
When the grunt task is executed in --debug mode, along with node-inspector running in parallel, I can use Chrome to debug the complete application.
With reference to Debugging in Visual Studio Code, I tried to achieve the same by updating the .settings/launch.json, with "program": "/usr/local/bin/grunt", "args": ["start"] and "env": {"NODE_INSPECTOR":"*"}.
I could find that debugger is attached only till ./task/server.js but on the whole application. I doubt, it may be due to the spawned server.
Is this possible to debug such situation in visual studio code? If yes, it will be of great help to know the details.
Your doubts are correct, you are configuring Visual Studio Code to attach to the grunt task starting the server, not the server itself.
You have two options to order to debug this:
Execute NODE_INSPECTOR=* grunt start form the terminal.
Once the server has started, attach the the running server to the Debugger, using the same Attach configuration available in launch.json. In the Debugger view choose the Attach from the profile dropdown and start the Debugger (green ► play button).
UPDATE --
Sarbbotam recorded a screencast for successfully attaching to his node.js app, you can find it here Visual studio Code - Attaching a Node App to Debugger
Configure VSCode to run the server directly, for that you won't have the grunt task listening to the changes and restarting the server. In order to do that change the program option to "bin/www"
We use VS Ultimate for web tests and load tests, but since moving to VS 2012 from VS 2010, the web tests don't seem to run anymore. We used to be able to do ctrl-r ctrl-t to debug specific tests, but that doesn't work anymore. I then found out about the issue with running tests in context, so I just tried running all tests, but that didn't work either. VS2012 is acting like it doesn't see WebTest as real tests anymore.
Even when I try to view the tests in the test explorer, nothing shows up. I know my tests are correct because I can go back in to VS 2010, and everything still works like it should.
Is anyone else having this issue?
Visual Studio 2012 dropped the "Test View" window that we used to use to run tests in VS 2010. The new "Test Explorer" window only recognizes Unit Tests and Coded UI Tests, as you've discovered. This totally threw me off too.
To run web and load tests (besides the obvious but tedious method of actually opening them and clicking "Run" in the editor window) you have to select the tests you want to run in the Solution Explorer, then Load Test (menu) > Run > Selected Test. Or alternatively "All Tests in Solution".
You also have the option of running the individual Web Tests that are contained in any open Load Test. Right-click on the Test Mix node (in Scenario) or any of the tests in the Test Mix.
For completeness here is the authoritative source: http://msdn.microsoft.com/en-us/library/ms182541.aspx
By the way, here is another gotcha: although you still choose testsettings for a Load Test from the Load Test menu, you now set the testsettings for Web Test execution separately, under the Test menu: