Dart-code: Flutter beta testing

Created on 13 Jun 2017  路  64Comments  路  Source: Dart-Code/Dart-Code

Download v1.5.0-beta.flutter.5 here

If testing, please post feedback in this thread including which platform you were testing on (Win/Mac/Linux). Any problems/issues can be raised as new issues but general feedback (even if everything works) is encouraged to help gauge stability (esp on platforms I can't test).

Since there may be updates to this beta version, you may wish to subscribe to this thread to get notifications

Gitter Chat

Installing

  • Uninstall any existing version of Dart Code from Code and restart Code
  • Download the vsix from the link above
  • Run the Extensions: Install from VSIX command from the Code command palette and browse to the downloaded vsix file
  • Restart Code again

Note: To revert to the marketplace version of the extension you will need to uninstall the beta version explicitly first.

Some things to test

If you test any of these any they work, please let me know (and on which platform)!

Windows

  • [x] Flutter projects are detected as flutter and the Dart SDK version number in the status bar (right) shows that it's the Flutter version
  • [x] Standard Dart projects are still detected as Dart and the Dart SDK version number in the status bar (right) does not mention Flutter
  • [x] pub get and pub upgrade packages have been replaced by flutter commands in the command palette/pubspec.yaml toolbar
  • [x] The status bar shows when a device is connected and if multiple devices are connected you can click on it to select the one to use for launching/debugging
  • [x] You can launch apps on the selected device by pressing F5 (note: the first time you do this, Code will ask what type of app - select Flutter which will open launch.json and then hit F5 again to launch
  • [x] Breakpoints are hit correctly and you can step with the debugger
  • [x] Other debugger features work correctly (stack traces shows, can be navigated, watched variables/locals etc. work)
  • [x] Pressing the debugger Restart button (also Ctrl+Shift+F5) causes a hot reload
  • [x] Breakpoints work after hot-reloading

Mac

  • [x] Flutter projects are detected as flutter and the Dart SDK version number in the status bar (right) shows that it's the Flutter version
  • [x] Standard Dart projects are still detected as Dart and the Dart SDK version number in the status bar (right) does not mention Flutter
  • [x] pub get and pub upgrade packages have been replaced by flutter commands in the command palette/pubspec.yaml toolbar
  • [x] The status bar shows when a device is connected and if multiple devices are connected you can click on it to select the one to use for launching/debugging
  • [x] You can launch apps on the selected device by pressing F5 (note: the first time you do this, Code will ask what type of app - select Flutter which will open launch.json and then hit F5 again to launch
  • [ ] Breakpoints are hit correctly and you can step with the debugger
  • [x] Other debugger features work correctly (stack traces shows, can be navigated, watched variables/locals etc. work)
  • [x] Pressing the debugger Restart button (also Ctrl+Shift+F5) causes a hot reload
  • [x] Breakpoints work after hot-reloading

Linux

  • [x] Flutter projects are detected as flutter and the Dart SDK version number in the status bar (right) shows that it's the Flutter version
  • [x] Standard Dart projects are still detected as Dart and the Dart SDK version number in the status bar (right) does not mention Flutter
  • [x] pub get and pub upgrade packages have been replaced by flutter commands in the command palette/pubspec.yaml toolbar
  • [x] The status bar shows when a device is connected and if multiple devices are connected you can click on it to select the one to use for launching/debugging
  • [x] You can launch apps on the selected device by pressing F5 (note: the first time you do this, Code will ask what type of app - select Flutter which will open launch.json and then hit F5 again to launch
  • [x] Breakpoints are hit correctly and you can step with the debugger
  • [x] Other debugger features work correctly (stack traces shows, can be navigated, watched variables/locals etc. work)
  • [x] Pressing the debugger Restart button (also Ctrl+Shift+F5) causes a hot reload
  • [ ] Breakpoints work after hot-reloading

If you get stuck, feel free to give me a shout in Gitter Chat.

in flutter is discussion / feedback

Most helpful comment

Unfortunately I've hit another issue with debugging flutter apps. Breakpoints don't seem to work after a hot reload (even after I've implemented what I understood to be required). I've raised https://github.com/flutter/flutter/issues/11040 hoping for some input; though it means it's likely to be a little longer before this is ready to release (I'd hoped it'd be in a reasonable state this weekend, but it's very unlikely now).

Once I managed to get to the bottom of these issues I'll upload another beta for some final testing before it goes live. Thanks for all the testing so far!

All 64 comments

For those who haven't had to manually install an extension before, the Command Palette has Extensions: Install from VSIX. Navigate it to your downloaded copy and you're set. :)

Can't you just double-click the vsix file?

Can't you just double-click the vsix file?

Not on Mac at least.

Definitely not for me (Windows). And using "Open with Code Insiders" just tried to open the binary for editing.

@DanTup This is a silly question but I can't seem to find how to run the app...

@pulyaevskiy Hit Debug > Start Debugging and when prompted add a 'Flutter mobile app' launch config.

@DanTup is there a device/target picker somewhere?

@mit-mit It should be the device name in the bottom-right corner. (I don't have 2 devices to test right now, but that's what I remember being discussed.)

Oh, I see that now. I'm used to the that lower bar being an "output only" status bar. Is that usually used for input in VSCode?

@mit-mit I believe it was to keep in-line with where VS Code lets you select the current file's Language Mode, Encoding, EoL type, etc. I guess that's just the way VS Code does things.

Oops, sorry, thought you could double-click! I've added some notes on installing/using to the top of this page (inc. a bunch of things work testing).

@pulyaevskiy F5 is easiest, though the first time you'll need to do select Flutter then do it again (the first time populates the launch.json file and opens it for editing in case you need to fill anything in - for now you don't).

@mit-mit Yeah, this is consistent with similar things in Code (eg. setting indentation, language, encoding and other things that appear in the status bar). That said; I think those other things may also have commands in the command palette to invoke them - I'll check when next at PC and if so, I'll add one for this too (that probably also makes it possible for the user to key-bind)

Thanks @mit-mit , @DanTup . My issue was that I installed beta version on top of the stable one, which made VSCode very confused. It didn't want to show me launch option for Flutter.

I had to do multiple restarts of VSCode deleting the beta version first, then the stable version and only after that installing beta again.

Strange; I would've expected it to work fine (though you do need to restart once after installing normally). Glad it's sorted now!

I added a checklist to the top; would appreciate notes on things that work/don't, esp for people on Mac/Linux since I've not been able to do any testing of them!

I had the same issue as @pulyaevskiy. Probably not important and likely more a install vsix on top of stable extension issue than a Dart-Code issue but it was showing me the reload button on the Dart-Code extension even after reloading with that button. I think in practice, the extension never updated even if I quit the app, reopen the project etc.

Only uninstalling the stable version and installing straight from the vsix worked.

Weird; does sound like a Code bug. I've added a note to uninstall the old version before installing this at the top.

Old plugin uninstalled, close VS, install beta from vsix on OSX, reload VSCode.
Dart code is not recognised anymore.
Flutter file are shown are plain text and dart type is no more listed.
Installing 14 again make code recognition OK
Dart 1.24

The debugger integration is super awesome!!!

One v1.6 feedback I'd have is that it'd be good to hook key input into the tool as well.

After running flutter run, the tool hangs around listens for more keys (options shown by pressing 'h'). It would be good to be able to communicate those via the extension.

@Solido

Old plugin uninstalled, close VS, install beta from vsix on OSX, reload VSCode.

Strange! After installing like this, does the extension show up in the extensions list? If so, my guess is that something failed during activation. Could you click Help -> Show Developer Tools to open the Chromium dev tools and see if there are errors in the console? If so, please raise a new issue with the errors (if not, let me know and I'll think of something else to try).

@xster

One v1.6 feedback I'd have is that it'd be good to hook key input into the tool as well

After running flutter run, the tool hangs around listens for more keys (options shown by pressing 'h'). It would be good to be able to communicate those via the extension.

I don't understand, could you elaborate on this? You shouldn't be running flutter run, it's done behind the scenes for you (you should just hit F5). The mode we run flutter in (flutter run --machine) doesn't take key input, it's a JSON API.

If you mean you're just trying to access additional functionality that you can normally access with flutter run, can you give examples? I'm sure we can integrate them better than just passing keys through to the process (for example, hot reload is integrated with the debugger Restart button).

Uninstalled VSCode fully and reinstall to have the last version was it. Check for update skipped the last version.

All previous points confirmed except for debug points.
Breakpoints are triggered, I can navigate the stack and source is updated with but when exploring the variable content spinner never stop and nothing open to show values.
None of the action (run, enter, previous, next) trigger and action only choice is to stop the App.

Once breakpoint is reached all is frozen, smth calling Stop will break the connection with IOS simulator but the app is still lost in frozen state. I need to first relaunch the app which lead to

Unhandled exception:
Exit code 3 from: /usr/bin/xcrun simctl launch B847B97F-1BAE-48EF-9313-99BC7E7F92D2 com.yourcompany.projectSky ... --enable-checked-mode --start-paused --observatory-port=0 --diagnostic-port=8101
...
#0      runCheckedAsync (package:flutter_tools/src/base/process.dart:214)
<asynchronous suspension>
#1      SimControl.launch (package:flutter_tools/src/ios/simulators.dart:253)
#2      IOSSimulator.startApp (package:flutter_tools/src/ios/simulators.dart:477)
<asynchronous suspension>
#3      FlutterDevice.runHot (package:flutter_tools/src/resident_runner.dart:233)
<asynchronous suspension>

This stop the simulator and I can start the app again.

All in all I love the experience, very limpid 馃挴

@Solido Interesting; that sounds exactly the issue I reported at https://github.com/flutter/flutter/issues/10615. Last night it only occurred on the Hello World so I figured it was less important.

Seem like we'll need to get to the bottom of this before shipping.

@ everyone else - is anyone else seeing this same behaviour (process seems to freeze after hitting a breakpoint)? Or has anyone else been able to debug normally?

Another thing I'd love to have feedback on... Currently the debugger Restart button is "hot reload" and to do a full restart you need to Stop/Run again. Since I have no real experience of Flutter dev I don't know if the Stop/Run will become annoying - would it be better to have the Restart button do a full restart and add a separate command/keybinding that does a hot reload (unfortunately I think it's unlikely I'll ever be able to add an additional button to the debug toolbar, that's owned by Code).

I haven't done a lot of Flutter dev, but from my limited experience I use Hot Reload all the time, so I think it deserves to have a dedicated button.

The difference between Stop/Start and a Restart, is that Restart doesn't rebuild the apk to install.

I can't say with certainty, but I think it just closes the app on the device, resyncs files, and starts the app again. I'm sure someone from the Flutter team would know better.

@Skylled Ok, so it sounds like there's a difference in behaviour between a "full restart" and actually stopping/re-running flutter run? I wonder why that is; if the APK doesn't need rebuilding for a "full restart" I wonder why flutter run rebuilds it?

If this is the case, it sounds like using the Restart button for hot reload might actually mean that full restarts (when required) are much slower. So I wonder if maybe we should use the restart button for a "full restart" and have another option (keybinding/toolbar button/maybe even notification when you save a file and are debugging) for hot reload.

@devoncarew interested in your opinion here; you probably have most flutter experience here (my experience is basically running Hello World and the Stocks example, so I won't know what % of the time people can use hot reload and how often they'd need full restarts).

A hot reload will push changed files over to the device and attempt to patch the changes into the running app; user's generally do lots of reloads before fully restarting their app, and it's likely the experience we want to optimize for. Perhaps 600ms today?

A full restart sends any changed files over to the device (like reload), but then restarts the isolate. You lose any state that had been built up in the app. It's really not much slower than a hot restart. It's useful to expose, but probably not the experience we need to optimize for. This takes maybe 800 - 1,200 ms last I checked.

A stop and a re-run would need to re-build the apk and re-deploy it to the device. This would be ballpark 3-12 seconds.

My 0.02 would be to keep the Restart button hooked up to hot reload for improved discoverability of that feature, even at the expense of not exposing the full restart functionality well :)

@devoncarew Sounds good, thanks!

Strange thing I noticed:

  • in a Flutter project all the commands (e.g. organize directives) and quick fixes (e.g. create constructor) are working fine
  • in a regular Dart project none work

Anyone else noticed it?

@pulyaevskiy Oh dear, that sounds bad. Can you raise a specific issue about that. Also click Help -> View developer tools to see if there are any errors there and enable the analyzer log file (dart.analyzerLogFile) to see if anything obvious in there.

Here: #321

I've attached a new build, v1.5.0-beta.flutter.2 to the original release page here. The only difference is a null ref fix for loading non-flutter projects.

Thanks! Nice to have quick fixes back. :-)

If anyone is seeing issues stepping with the debugger (seems to just hang), can you confirm what OS you're on?

Also; I've had no feedback on any of the checklist items above - if you've tested them please let me know on which platforms so I can see what's still untested.

Thanks!

My main flutter project is detected correctly (I don't have any non-Flutter projects to test with).
Get Flutter Packages and Upgrade Flutter Packages both correctly display on pubspec.yaml.
Pub commands from the command palette also get redirected correctly to Flutter Packages.
Physical devices and emulators both get detected, and labeled as Physical and Emulator correctly.
Connecting a new device automatically switches to that device.
F5 works on Physical and Emulated devices.
The stop button closes the app, and disconnecting the device stops debugging.
And hot reload is a smooth experience as expected.

The only thing not working as expected is debugging.
I can't really figure out why breakpoints in the same test code work in some areas but not in others.
It might be that the app needs to begin its initial startup before breakpoints work.

All of the above tested on Windows.

@Skylled Thanks for the excellent info :-)

The debugging is a weird one (see https://github.com/flutter/flutter/issues/10615). I can't figure it out; it seems like either Observatory is crashing or the connection to it is somehow becoming broken. If I try to step really quick after starting the app it works, but after a couple of second it's just completely no-responsive.

The flutter devs haven't been able to repro this but it's very reliable for me (I don't know if it might be Windows-specific). I'm running out of ideas for tracking it down :(

I've split the checklist at the top into platforms and started ticking things off. If anyone on Mac or Linux is able to confirm any of these working, please lmk!

Just in case I wasn't clear all the mac points worked for me except the debug that freeze.
If other testers can confirm on mac.

@Solido Sorry, misunderstood your comments and didn't ralise you're on Mac. That's great; I'll tick them all off!

Anyone using Linux? I tried creating a VM but Ubuntu's installer crashed and left me with a bad install on every attempt across 3 machines! :-/

@Solido I see from https://github.com/flutter/flutter/issues/10125 that you have IntelliJ? Do you see this issue there using the same code/breakpoint/steps?

I still can't figure out of this is a Dart Code issue or not - I don't know what I could do to cause this but since nobody is reporting it outside of Dart Code it seems likely I'm doing something strange.

Never met the breakpoints freeze using intelliJ. Could it be a disconnection between VSCode and the DartVM ? can you monitor the protocol to see if the call is made when an UI Event occurs ?

How it works is kinda complicated - VS Code runs a debugger process (communicating via stdio) which hosts our debug adapter. Our debug adapter kicks off flutter run --machine (also communicating over stdio) which returns an Observatory URL. We then create a web socket from the debug adapter to that websocket and then talk to Observatory over that. To complicate things, the web socket URL we get is for localhost even though Observatory is running on the device - I figure it's using adb forward to map the port over (so there's yet another thing in the mix!).

As far as I can tell, the web socket remains open when this happens, yet we never get any response from it (almost like the socket is up but the thing processing the messages has crashed).

I've logged all the communication and also been through hooking ever data/error/close event I can and not found anything useful; I can't see anything that could be wrong in Dart Code. Yet, nobody has reported it anywhere else, suggesting that even if it's not something I'm doing wrong, there must be something I'm at least doing differently!

I've been trying to avoid installing other IDEs on my machine but I might end up having to. It'd probably be useful to perform the same steps in Dart Code and IntelliJ and then compare the logs to see if there's anything obviously different. I'm also thinking of just trying to extract the npm JS from Dart Code so I can repro this outside of the debug adapter (etc.) which might make it easier to trace through what's going on.

I should have some free hours this Friday so I might have a shot at one (or both) of these to see if I can crack it. Other than confirmation things work on Linux this is probably the only blocker to shipping this.

I've never been stuck with debug but this one https://github.com/flutter/flutter/issues/10125 happen a lot. Can it relate to your case ? how to you manage VSCode UI if you fail to get the Observatory URL. It's possible that's what happen to me and nothing was log out so further order send to it simply do nothing ?

In intelliJ this case with simply deny the application to launch but maybe you handle it differently ? don't want to send you false indication but just telling that my only case with intelliJ so maybe there's a common case to explore or nothing at all.

We definitely get the observatory url and communicate with it for a while, the logs in the issue show responses from Observatory (for example we have to send a Resume request initially because we use --start-paused and we also get back the event for hitting the breakpoint which we use to tell VS Code to jump to that location and show that we're at a breakpoint).

If I can't repro this in IntelliJ then it should be relatively easy to isolate the differences and figure out the cause (assuming I can get good logs out of IntelliJ for observatory communication).

@DanTup
I've finally spent some more times with the beta.

OS: MacOS
Devices: iOS simulator

Couldn't get breakpoints to work but everything else from the list is working fine.
I couldn't test stack traces with debugger because it wouldn't want to break on exceptions.

I also got a "Lost connection to device" error once, which terminated debug session.

In the off chance that Flutter cannot install an app to the device, the debugging process doesn't stop.
Logs:

Launching lib\main.dart on LG H910 in debug mode...
Built C:\flutter\examples\stocks\build\app/outputs/apk/app-debug.apk (21.7MB).
Error: ADB exited with exit code 1
Error launching application on LG H910.

But the process continues.

@pulyaevskiy

I couldn't test stack traces with debugger because it wouldn't want to break on exceptions.

You should be able to see the stack when it breaks on a breakpoint (even if it freezes shortly after!)

I also got a "Lost connection to device" error once, which terminated debug session.

Interesting - where did you see this? This is somewhat out of Dart Code's control but I wonder if it might be related/similar to the connection to observatory breaking. Can you repro this?

@Skylled

In the off chance that Flutter cannot install an app to the device,

Thanks for the info - could you chuck this in a new issue, including a description or screenshot of what happens after this (I presume Code thinks that it's debugging and keeps showing the debug toolbar?).

You should be able to see the stack when it breaks on a breakpoint.

it just never did break on a breakpoint for me.

Can you repro this?

Seems random, wasn't able to reproduce yet. Will try to collect more info when/if it happens again.

it just never did break on a breakpoint for me.

I guess this is the same issue others (and I) are seeing. Normally I can hit a breakpoint but after a second or so it's unresponsive. I suspect if it took longer to get to the first breakpoint it may miss that too.

Hoping to do some more digging on Friday.

May have a fix for the debugging issue (#332). If I can get some time to test this today I'll create a new beta release with the fix for more testing. Hopefully then there's only fairly minor things to fix before releasing for real (some of this might get delayed for a v1.4.3 to address some debugging issue in 1.25 SDK though).

Ok, there's a new beta release.

You may need to uninstall the previous version before installing this. It's the same as the previous version except it has a fix for the debug stepping issue (the problem was that we were connecting to the debugger too early - which strangely allows it to work for a few seconds and then it stops).

Please test it out and let me know if it resolves all the debugging issues you had.

Tested with VS Code 1.13 & Ubuntu 14.04.

I tried all the points within the Linux section above and all worked fine except for an issue with Debug and hot reload. If I launch a Flutter app and hit a breakpoint I can step through the code in VS. If I then make a change and perform a hot reload, VS will no longer stop at the breakpoint. If I do a full restart the debugging starts working again. Not sure if this is expected behaviour, but comparing it to IntelliJ, the breakpoints still work after a hot reload.

@amugofjava Excellent; thanks for the testing! The behaviour you describe is not expected; if it works in IntelliJ it should also work here. I'll see if I can repro and if not I might give you some instructions to get debug logs that'll help.

@DanTup I believe we added that support for IJ via https://github.com/flutter/flutter-intellij/issues/305

@mit-mit Aha! That would explain it; if the breakpoints are lost I'll need to resend them. Should be easy. Thanks! :-)

Possibly related to the issues people had with vsix installs: https://github.com/Microsoft/vscode/issues/19259

An extension which is installed manually through a VSIX and an extension with the same ID that gets fetch from the gallery are not considered to be the same extension.

Based on this, when v1.5 releases for real, you'll need to be sure to install the vsix version explicitly!

Unfortunately I've hit another issue with debugging flutter apps. Breakpoints don't seem to work after a hot reload (even after I've implemented what I understood to be required). I've raised https://github.com/flutter/flutter/issues/11040 hoping for some input; though it means it's likely to be a little longer before this is ready to release (I'd hoped it'd be in a reasonable state this weekend, but it's very unlikely now).

Once I managed to get to the bottom of these issues I'll upload another beta for some final testing before it goes live. Thanks for all the testing so far!

I've uploaded a new beta version.

Please uninstall the previous beta and try this one; it will hopefully resolve issues with breakpoints not being hit after a hot reload (note: there is a race condition caused by https://github.com/flutter/flutter/issues/10934 which needs fixing in the SDK).

Let me know if you hit any issues; I've only been able to test on Windows.

I've had a little feedback on this so far, but only from Windows users. If anyone is able to give beta4 a test on Linux and/or Mac I'd appreciate it.

I believe this is basically complete and plan to ship 2.0 next week once I've finished a couple more minor changes.

I'll try and give it another go on my Ubuntu setup tomorrow if I get chance. :)

I've pushed a final flutter beta (beta5) here:

https://github.com/Dart-Code/Dart-Code/releases/tag/v1.5.0-beta.flutter5

I believe this is basically feature complete and will be shipped as v2.0 in the next week or so (maybe with some fixes, depending on feedback). If you're able to try this out, please let me know how it works (and on what platform).

In addition to fixes in previous betas there have been some other minor tweaks:

  • #319 - Hide trailing commas in code completion
  • #329 - Ensure debugger terminates when app installs fail
  • Analysis server version shown alongside SDK version in status bar
  • #340 - When running with Ctrl+F5 don't connect debugger
  • #327 - Set FLUTTER_HOST env var for Flutter tools telemetary
  • #328 - Include Dart vs Flutter tag in analytics

I tested beta5 on macOS, and unfortunately seem to be having some issues with breakpoints, opened https://github.com/Dart-Code/Dart-Code/issues/357.

All non-breakpoint related items on the checklist work fine on macOS.

@mit-mit Thanks; I've added some notes to that case that might help track it down. Not sure if it might've been a one-off (the error is weird, and probably not my fault).

Curious if anyone else has same behaviour on Mac OS (@devoncarew on Mac?); I don't have access to one to test :-(

I'm planning on pushing Dart Code v2 out tomorrow evening (~26 hours from now). I should have some time on Thurs/Fri to push out an update if it does happen to have issues and I can fix them.

@mit-mit I'll tackle #357 in 2.1 if you can still repro and provide some more info.

Thanks everyone that helped test and provided feedback; it's great to (finally) publish this!

ICYMI, Dart Code v2 is available in the marketplace. Be sure to uninstall any beta version and restart Code before installing (Code doesn't properly consider vsix and marketplace extensions as the same).

I noticed in the stats there are still some people using the Flutter beta version of Dart Code! :/

In older versions of Dart Code, vsix extensions didn't upgrade cleanly when the marketplace version was newer. If you installed a beta version of Dart Code and don't think you've seen any updates recently, please try uninstalling the extension, restart Code, check whether it still appears installed (and if so, uninstall again and restart Code again) and then install again from the marketplace!

Was this page helpful?
0 / 5 - 0 ratings