Search code examples
fluttersafariflutter-web

How can I debug a Flutter Web App on Safari using the inspector?


I am using flutter to write a simple app, everything works fine on Android, iOS, and Chrome. (I've also tested on Firefox & Brave Browser, all's well).

However, on Safari (Mac & iOS), the flutter app gets stuck on the index.html file and does not load the PWA.

The error from the console on Safari Inspect

The error from the console on Safari Inspect

How can I know what the anonymous function in js_helper is, or what main.dart.js:57063 refers to?

  1. Is there any way of building for web without minifying?
  2. Has anybody encountered a scenario where everything works on all platforms except Safari?

Flutter Doctor Flutter Doctor

Log from console when running on local server enter image description here


Solution

  • You won't be able to debug it directly on Safari, but if you just want to test your app in safari with localHost, you can use these steps :

    1. Enable 'developer' menu in Safari from settings of Safari :

    enter image description here

    1. Then check on 'Disable Cross-Origin restrictions"

    enter image description here

    1. Now after running release version of web app in chrome, use same app's address in Safari, you will be able to test it. Ex. http://localhost:51155/

    enter image description here

    to run in release mode : flutter run -d chrome --release

    Hope this helps!