bug: launch_url fails with pop-up blocker on safari

[gbrandt]

using launch_url with web_window_name of "_blank" fails on safari due to too much delay (as per flutter/flutter#78524)

I have done all I can to reduce the delay, but the time it takes for a button click to go from the browser to the server and back is enough to stop Safari from opening the new tab.

Code example to reproduce the issue:

import flet as ft


def main(page: ft.Page):
    page.add( ft.ElevatedButton("Hello World", on_click=lambda e: e.page.launch_url( "https://google.com")))


ft.app(target=main, view = ft.WEB_BROWSER)

I expected a new tab to open but instead get a message about a blocked pop up

Does not occur on firefox

Name: flet
Version: 0.4.2
Summary: Flet for Python - easily build interactive multi-platform apps in Python
Home-page:
Author: Appveyor Systems Inc.
Author-email: [email protected]
License: Apache-2.0
Location: /Users/gregor.brandt/Documents/Startbridge/web-app2/fe_env/lib/python3.11/site-packages
Requires: flet-core, httpx, oauthlib, packaging, watchdog, websocket-client, websockets
Required-by:

[gbrandt]

A webbiew would solve this issue as the link could be put into a webview and be acted on within the browser.

[ndonkoHenri]

Just from testing flutils link to docs on iPhone Safari and had thesame issue. (No new tab with the expected link)

[gbrandt]

The only way to fix this is to get the link click action in safari itself and not incur a roundtrip to the server.

[FeodorFitsner]

I've been thinking a lot about this issue. It's no-go of cause...

How about we add a new href (and target?) property to all buttons (and other clickable things?), so it triggers launch_url on a client side? I have a feeling it could work as delay will be negligible.

[gbrandt]

I think that may work, not sure of the timing requirement here. Any lag in the communications would cause this to fail. A work around is to have an HTML Control and let us put a <a ...> tag into it. This would kill two birds with one stone, as we could then also have a generic web view (for instance, we use chatwoot for support and we cannot use it in flet right now because we can't put html/javascript directly into an app).

One thing to think about here is links in Markdown as well, the round trip on safari means we can't open a new tab

[gbrandt]

If there was a way to have the link work 100% locally on the browser, it would work every time.

[FeodorFitsner]

Markdown is not a problem as we could add something like autofollow_links and open them directly on the client.
I'll give it a try.

[FeodorFitsner]

I've made a small prototype with url parameter for ElevatedButton:

import flet as ft


def main(page: ft.Page):
    page.add(
        ft.ElevatedButton(
            "Open with CLICK",
            on_click=lambda e: e.page.launch_url("https://google.com"),
        ),
        ft.ElevatedButton("Open with URL", url="https://google.com"),
    )

ft.app(target=main, view=ft.WEB_BROWSER)

Clicking "Open with URL" button on Safari successfully opens a new tab with 100% reliability while, as expected, clicking "Open with CLICK" gives a blocked popup.

I'm going ahead and add url and url_target to all "clickable" controls:

• Container
• ElevatedButton
• FilledButton
• FilledTonalButton
• FloatingActionButton
• IconButton
• ListTile
• OutlinedButton
• TextButton
• TextSpan

New properties added to Markdown to auto-follow links:

• auto_follow_links - default is False. on_tap_link event fires anyway.
• auto_follow_links_target - default is _blank - new tab/window.

[FeodorFitsner]

The solution could be tried with Flet pre-release.