Flutter web app is opening upside down on chrome <= 110

[talski]

Is there an existing issue for this?

• I have searched the existing issues
• I have read the guide to filing a bug

Steps to reproduce

I've a web app, multiple users are complaining that the app is opening upside down, you can test it here:

https://www.browserling.com/browse/win10/chrome110/https://dartpad.dev/?id=e75b493dae1287757c5e1d77a0dc73f1&channel=master

Expected results

The web app should open as in the latest chrome version.

Actual results

The web app is showing upside down

Code sample

Code sample

Just open any web app built on the latest master version, dartpad is displaying the same problem

Screenshots or Video

Screenshots / Video demonstration

Logs

Logs

[Paste your logs here]

Flutter Doctor output

Doctor output

❯ flutter doctor -v
[!] Flutter (Channel [user-branch], 3.17.0-10.0.pre.43, on Fedora Linux 39 (Workstation Edition) 6.5.10-300.fc39.x86_64, locale en_US.UTF-8)
    ! Flutter version 3.17.0-10.0.pre.43 on channel [user-branch] at /home/talski/.puro/envs/master/flutter
      Currently on an unknown channel. Run `flutter channel` to switch to an official channel.
      If that doesn't fix the issue, reinstall Flutter by following instructions at https://flutter.dev/docs/get-started/install.
    ! Warning: `dart` on your path resolves to /home/linuxbrew/.linuxbrew/Cellar/dart/3.1.3/libexec/bin/dart, which is not inside your current Flutter SDK
      checkout at /home/talski/.puro/envs/master/flutter. Consider adding /home/talski/.puro/envs/master/flutter/bin to the front of your path.
    ! Upstream repository unknown source is not a standard remote.
      Set environment variable "FLUTTER_GIT_URL" to unknown source to dismiss this error.
    • Framework revision 0135a3310a (4 days ago), 2023-11-17 16:59:19 +0000
    • Engine revision 5064aeff00
    • Dart version 3.3.0 (build 3.3.0-143.0.dev)
    • DevTools version 2.30.0-dev.4
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and
      upgrades.

[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.dev/docs/get-started/install/linux#android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.


[✓] Chrome - develop for the web
    • Chrome at google-chrome

[✓] Linux toolchain - develop for Linux desktop
    • clang version 17.0.3 (Fedora 17.0.3-1.fc39)
    • cmake version 3.27.7
    • ninja version 1.11.1
    • pkg-config version 1.9.5

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/linux#android-setup for detailed instructions).

[✓] VS Code (version 1.85.0-insider)
    • VS Code at /usr/share/code-insiders
    • Flutter extension version 3.77.20231101

[✓] Connected device (2 available)
    • Linux (desktop) • linux  • linux-x64      • Fedora Linux 39 (Workstation Edition) 6.5.10-300.fc39.x86_64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 119.0.6045.123

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 3 categories.

[huycozy]

Hi @talski
I don't have an such old Chrome version but I can see the issue from browserling.com you mentioned. The issue occurs on Flutter beta and master channels (3.17.0) whilst it renders normally on stable channel (3.16.0).

[yjbanov]

I suspect this is caused by the single GL redesign. Optimistically assigning to @harryterkelsen for now.

[harryterkelsen]

Update: I was able to repro the issue with the browserling link, but unable to repro locally so far with Chromium 110 and Chromium 109 on my Macbook. This issue might be Windows-specific? I have hit my daily limit for browserling. I will attempt to repro the issue on my Windows machine.

[talski]

I tried this version on a windows 10 machine and it displays correctly, on windows 7 does not

[harryterkelsen]

My current working theory is that this bug will only reproduce with this specific combination of software:

1. Windows operating system
2. Chrome version <= 110

It seems that Window stores GPU backed bitmaps upside down, or to use their preferred terminology, "bottom up": https://devblogs.microsoft.com/oldnewthing/20210525-00/?p=105250

It also looks like Chrome had a bug which was fixed between version 110 and 111 which had to do with ImageBitmaps being rendered flipped when they were composited back into a Canvas after being converted to a GPU texture: https://chromium.googlesource.com/chromium/src/+/a7f9b00e422a1755918f8ca5500380f98b6fddf2

I am brainstorming solutions.