I came across this in DevTools when embedded inside VS Code (Dart-Code/Dart-Code#2852). Sometimes it would just render a tiny blue square where the app should be:

After much trial and error, I've managed to reproduce this in a simple Flutter app outside of VS Code:

This turns out to be only the first frame rendering, and then nothing more. The small square is the first frame of the CircularProgressIndicator rendered by the app. There are no errors or warnings listed in the Chrome developer tools/console.

It's pretty intermittent, but here's my steps:

• flutter create foo
• replace lib/main.dart with this simple app which renders a CircularProgressIndicator and then changes to a Text widget after 500ms.
• build the app with flutter build web --profile
• run the app through a web server, for ex with cd build/web && python3 -m http.server
• open the app in your browser

If you're lucky, it will just happen first time. Otherwise, you can press refresh repeatedly until it happens.

It seems to occur more frequently when I do one or more of the following:

• Open Chrome developer tools, go to Application and click "Clear site data"
• Copy the URL, navigate to another website, then paste the URL back into the address bar and press

It seems like a race I wonder if it might be related to the service worker (only because it seems more common after clearing the data - though it could just be something else cached that alters timing).

I littered the Flutter code with some prints to see if anything different was happening, and noticed that when this does happen, the call to scheduleBuildFor() triggered by the setState() call skips over the call to onBuildScheduled, though I don't understand this code enough to know if that's relevant (or always the case):

• Flutter version is master / Framework • revision 13896b3 (14 hours ago)
• OS is macOS Catalina (10.15.7 19H2)
• Chrome is 86.0.4240.111 (Official Build) (x86_64) / Revision b8c36128a06ebad76af51591bfec980224db5522-refs/branch-heads/4240@{#1290}