How do I fix Dart DevTools Widget Inspector that is stuck showing a circular progress indicator?

1.1k views Asked by At

I had a Flutter app crash while I was debugging it from the Dart DevTool "Logging" page. After this occurred, all I see when I start debugging is that the Widget Inspector shows a circular progress indicator. I'm now testing with the Flutter default app so it's not something in my code. I've tried restarting my computer a couple of times and the behavior hasn't changed.

An answer to a similar problem (Flutter inspector bugging out/freezing in Visual Studio Code) suggested adding dart.embedDevTools": false, to my VSCode settings.json file. I tried that and still get the same behavior, just in a browser window. Aside: this seems to suggest that the problem is not in VSCode. Finally, I also tried running the app from the command line and launching the DevTools application server directly--same problem.

Any ideas of how I might fix this would be appreciated! If there are none, I guess I will have to try uninstalling and re-installing Flutter and Dart to see if that fixes the problem.

>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 2.2.1, on Microsoft Windows [Version 10.0.19041.1052], locale en-US)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[√] Chrome - develop for the web
[√] Android Studio (version 4.1.0)
[√] VS Code (version 1.56.2)
[√] Connected device (2 available)

• No issues found!

>flutter clean
Deleting build...                                                  132ms
Deleting .dart_tool...                                              4.4s
Deleting .packages...                                                3ms
Deleting Generated.xcconfig...                                       4ms
Deleting flutter_export_environment.sh...                            2ms
Deleting .flutter-plugins-dependencies...                            3ms
Deleting .flutter-plugins...                                         4ms

>flutter pub get
Running "flutter pub get" in default_app...                      1,273ms

>flutter pub global run devtools

>flutter run -d chrome
1

There are 1 answers

0
j-vasil On

I finally reached a point where I had time to recover if the reinstall failed so here's what I did to fix this problem:

cd {installdir}\flutter
git clean -xfd
git stash save --keep-index
git stash drop
git pull
flutter doctor
rem • No issues found!

The issue was probably fixed at this point but I went ahead and did the following (except for the two rem steps that I only do when trying to figure out package dependency issues):

cd {projectsdir}\appname
flutter pub upgrade
rem flutter pub outdated
rem flutter pub deps -s list
flutter clean
flutter pub get
cd ..
code appname           // Open folder in VScode
<F5>

At this point, DevTools Widget Inspector and Logging are working again!!

Thanks to Suragch who posted the Git steps in an answer to How do you uninstall Flutter completely and properly from a Mac?.

It would be nice to add this info to the Flutter Windows install page but I'm not sure how to even suggest that.

Final Thoughts

There could be issues where this refresh doesn't work. In that case--and in the case where one didn't install flutter as a git repository--I believe that the fix would be:

* delete the flutter directory where you installed flutter,
* remove the paths related to flutter from your environment variable PATH, and
* install Flutter per the install page.

I caution that I haven't tested this approach! If anyone encounters a problem that forces them to resort to this fix, posting an answer here would be appreciated.