Flutter Web - Blank Screen on IOS 12.5.7

[stefanhk31]

Steps to reproduce

1. run flutter create my-project
2. navigate to the project, and on a macbook with an attached iOS device (needs to be physical device), run flutter run -d web-server --web-port {port} --web-hostname {my.ip.address}
   3: on the connected iOS device, open up http://(my.ip.address}:{port}

Expected results

You should see the standard Flutter counter app that you see when running on macos browsers

Actual results

iOS Safari just shows a blank screen. If you have Safari developer tools open for your connected device, you can see some vague errors in the console:

Code sample

Code sample

View minimal repro sample here

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Logs

Logs

[Paste your logs here]

Flutter Doctor output

Doctor output

[✓] Flutter (Channel stable, 3.19.6, on macOS 14.4.1 23E224 darwin-arm64, locale
    en-US)
    • Flutter version 3.19.6 on channel stable at
      /Users/stefanhk/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 54e66469a9 (9 days ago), 2024-04-17 13:08:03 -0700
    • Engine revision c4cd48e186
    • Dart version 3.3.4
    • DevTools version 2.31.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
    • Android SDK at /Users/stefanhk/Library/Android/sdk
    • Platform android-34, build-tools 33.0.2
    • ANDROID_HOME = /Users/stefanhk/Library/Android/sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15E204a
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b829.9-10027231)

[✓] VS Code (version 1.88.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.86.0

[✓] Connected device (3 available)
    • Stefan’s iPhone 6 (mobile) • c59963ee3c2814c2f0a0a21ba0149ad8df679d32 •
      ios            • iOS 12.5.7 16H81
    • macOS (desktop)            • macos                                    •
      darwin-arm64   • macOS 14.4.1 23E224 darwin-arm64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 124.0.6367.93

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

</details>

[darshankawar]

Thanks for the report @stefanhk31
Check #144170 (comment) which could be the same reason as why you are seeing the reported behavior.
Also check #144170 (comment) if it helps in your case or not.