Flutter DevTools open a blank screen

Question

I'm running Android Studio 4.1.1 with Flutter 2 plugin, but I couldn't get DevTools to open by pressing its icon in the run window or by choosing Open DevTools from the more actions popup in flutter inspector, the result is always a blank web page. I have a running mobile app on an iOS simulator, but I don't know if that makes a difference.

Flutter version details:

Flutter 2.0.1 • channel stable • https://github.com/flutter/flutter.git
Framework • revision c5a4b4029c (11 days ago) • 2021-03-04 09:47:48 -0800
Engine • revision 40441def69
Tools • Dart 2.12.0

what's going wrong with DevTools ?

Yeld

Answer 1

In my case, it was because I was on Mac with the window opening in Safari, because it is usually the default browser on Mac. So I copied the URL to Chrome and that worked.

Monkeypot

can confirm this worked! – Hematite

Safari does not support localhosting? – Tragopan

As a macOS users, switching to a browser other than Safari worked for me as well. In my case, I switched to Firefox (Developer Edition) and that worked. – Method

Answer 2

In my case, using Windows 10, connecting to http://127.0.0.1:9100 in Chrome displayed a blank page. Using http://localhost:9100 worked.

Clue was provided in https://github.com/flutter/flutter/issues/35563#issuecomment-512493580.

Podite

I was the having the same problem and localhost worked, been searching for years :) . Thanks – Garnierite

Answer 3

In my case, using Windows 10 and working on WSL2, the issue was the default port of 9100 used by the dart DevTools. Despite my best efforts, I could not get it to work on port 9100, but luckily port 8000 seems to work out of the box. You just need to add the following to .vscode/settings.json in the vscode project:

{
    "dart.devToolsPort": 8000
}

Sergu