I want to add Firefox as my default browser when running flutter for web (chrome has errors with some packages). I've done this before on Ubuntu 20.4 but I've switched to arch and I can't remember how I've done it.
You can run the project with web-server as the device :
flutter run -d web-server
Then you can open the url where lib/main.dart is served (it is shown on console), from the browser of your choice (e.g Firefox).
Related
So i installed flutter(i use zorinOS). After following some steps, i run flutter doctor and get:
[✗] Chrome - develop for the web (Cannot find Chrome executable at
google-chrome)
! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
I don't have any chrome in my os.I use brave as my default browser, and i have deleted my firefox(my previous browser). I just wonder, do i need to install Chrome specifically? Can't i just install Chromium or use other browser?
We don't test our development flow with Chromium, so I'm not sure.
This requirement is only necessary for development: debugging, etc. We rely on Chrome features to enable our development experience.
I am not able to run the basic flutter application on google chrome as there is an option for google chrome, edge, and avd.
to add web support to an existing app
run flutter create . in the application terminal
to run it on chrome for example run flutter run -d chrome
I just started-off with flutter web and I want to use brave browser to debug my flutter apps not chrome or edge.
When I use flutter devices command, it gives the following result.
No devices detected.
Run "flutter emulators" to list and start any available device emulators.
I'm using brave by using the link provided by web-server and it does not support hot reload.
So, how to configure browsers other than chrome or edge with flutter web for complete functionality.
I found this:
All you have to do, based on your Linux operating system (for Windows
and macOS the process is similar), is to modify your .bashrc file and
insert this line:
#Put your Brave installation location here
export CHROME_EXECUTABLE="/opt/brave.com/brave/brave-browser"
For MacOs,
export CHROME_EXECUTABLE="/Applications/Brave Browser.app/Contents/MacOS/Brave Browser"
You can use flutter run -d web-server to run your app like a server.
This means that you can just enter the URL on any browser of your choice to access your Flutter app !
Drawbacks:
Hot Restart/Reload from the terminal is not possible. You must refresh the page on your browser instead.
Advantages:
You can use any browser for developing flutter apps.
You can even use ngrok to forward your port to a HTTPS URL, and access your flutter app from anywhere (your phone, your desktop , someone else's device etc.)
PS: Credits to the Issue #77229 for helping me find this solution. I am aware that this workaround has already been suggested on this thread.
I just wanted to put out a simpler answer for the general viewer.
I've been diving in the same issue, it's known Brave it's Chromium-based, this will help u https://github.com/flutter/flutter/issues/77229
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
How can I know what the anonymous function in js_helper is, or what main.dart.js:57063 refers to?
Is there any way of building for web without minifying?
Has anybody encountered a scenario where everything works on all platforms except Safari?
Flutter Doctor
Log from console when running on local server
debug for safari is not supported yet
but for anyone with the same problem you could solve it by running the app on release mode
flutter run -d chrome --release
after that open with the same port on safari and everything should be fine
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 :
Enable 'developer' menu in Safari from settings of Safari :
Then check on 'Disable Cross-Origin restrictions"
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/
to run in release mode : flutter run -d chrome --release
Hope this helps!
I need to troubleshoot an issue happening in a webview running within my app. This issue only occurs on Android versions lower or equal to 4.3. My app requires an up to date version of Google Play services.
In order to troubleshoot my webview, I usually can run my app under the Android Emulator (with the latest version of Android), then connect to the web view via Chrome (using chrome://inspect) - the web view appears in Chrome and I'm able to browse the DOM and debug.
To run the app under 4.3, I've created (under AVD) a new device from an existing device definition,
then picked the target Google APIs (Google Inc.) - API Level 18. I've then installed my app, but when trying to run it, I get the error message "This app won't run unless you update Google Play services.". There's an "Update" button on the previous dialog, but nothing happen when clicking on it.
I then tried to debug my issue using Genymotion. I've created a device under 4.3, followed these instructions to flash my device with the latest Google Play services and installed my app. I can now run the app and reproduce the issue within this simulated environment.
The trick now is to be able to connect to the web view from my local Chrome browser. I've enabled remote debugging as described here. Now my device appears in Chrome, but the web view is not showing up in the inspector. Similarly, if I open a new tab under the native browser, it won't show up in the remote inspector. If I open a new tab under Android Chrome though, I can see it showing up under my remote Chrome inspector.
I can see two way moving forward and successfully accessing to the DOM of my webview:
Fixing the "Update" issue under the Android Emulator running 4.3
Or
Connecting to my web view from my Chrome inspector while running the app under Genymotion
Any idea on how to solve one of these two problems?
I have been using weinre for sometimes. it's a pretty good tool to debug webview for android 4.3 and lower. It provides almost same interface as chrome debugger.
All you need to do are:
Install weinre
sudo npm -g install weinre
Client side:
Insert the following code to your webpage <head> section.
Note: it's better to put it at end of <head> section, otherwise there will be some strange errors and debugger won't show up.
<script src="http://<your server ip here>:8081/target/target-script-min.js"></script>
Server side
weinre --boundHost -all- --httpPort 8081
Debugger
open the debugger tool from weinre from your desktop browser:
http://localhost:8081/client/
Finally,
select any target in Targets part and then start debugging.
Remote debugging web views only works on devices with android 4.4 and above.
have a look at this :
https://developer.chrome.com/devtools/docs/remote-debugging