Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

PWA with TWA: How to force Chrome instead of default browser

I have built a PWA with TWA & generated APK following the official Google guide here - https://developers.google.com/web/updates/2019/02/using-twa

What's happening is that when a different browser apart from Chrome is set as default, the behaviour is unpredictable. For example: on a Xiaomi phone where MI Browser is the default, my app works just as a shortcut & the page just loads in one of the tabs of the browser. This phone had Chrome installed, but my app still used the default browser to render my PWA.

Official documentation states the following:

Today, if the user's version of Chrome doesn't support Trusted Web activities, Chrome will fall back to a simple toolbar using a Custom Tab. It is also possible for other browsers to implement the same protocol that Trusted Web activities use. While the host app has the final say on what browser gets opened, we recommend the same policy as for Custom Tabs: use the user's default browser, so long as that browser provides the required capabilities.

While the guide has this paragraph, I'm unable to find any documentation on how to set a preferred browser for my PWA

like image 415
hnprashanth Avatar asked Apr 05 '19 08:04

hnprashanth


2 Answers

Forcing Chrome as the browser to handle the Trusted Web Activity is not recommended, as the number of browsers that support Trusted Web Activity is growing and developers should try to honour the user's browser choice as much as possible.

The implementation that chooses the browser in android-browser-helper will:

  1. Look for browsers that support TWAs, if you find one, pick it.
  2. Otherwise, look for browser that support Custom Tabs, if you find one, pick it.
  3. Otherwise launch to the default browser.

Alternatively, developers can choose to replace number 2 and 3 with a WebView fallback implementation, even though there are tradeoffs on the supported feature set.

Regarding the below:

on a Xiaomi phone where MI Browser is the default, my app works just as a shortcut & the page just loads in one of the tabs of the browser. This phone had Chrome installed, but my app still used the default browser to render my PWA.

There are a few things that may be happening here:

  1. The Chrome version installed is not up to date and doesn't support Trusted Web Activity, so it's falling back to (2)
  2. The MI browser declares to support Trusted Web Activity, but doesn't really. This seems to be the case on Kindle Fire devices.
  3. A possible bug on the logic that chooses the browser.

For 1, the solution is updating Chrome and everything should work. Otherwise, enable the WebView fallback.

For 2, it sounds like what is needed is a "disallow list" to avoiding using browsers that are known to declare support but don't. I'd recommend filing a feature-request at https://github.com/GoogleChrome/android-browser-helper/

For 3, file a bug at https://github.com/GoogleChrome/android-browser-helper/

Update: I installed MI Browser with a project generated via Bubblewrap. MI Browser doesn't declare support for Trusted Web Activity and Chrome is opened as expected. I'm leaning towards the problem being related to (1) above.

Finally, it is possible to implement your own provider picker for Trusted Web Activity, where you could maintain a "disallow list" while an automated way is not implemented in Android Browser Helper. See this sample for details.

like image 193
andreban Avatar answered Sep 25 '22 14:09

andreban


To open URL in Chrome i'm using Chrome custom tabs from androidx.browser.browser:1.0.0 First i check if Chrome custom tabs are supported

const val SERVICE_ACTION = "android.support.customtabs.action.CustomTabsService"
const val CHROME_PACKAGE = "com.android.chrome"

private fun Context.isChromeCustomTabsSupported(): Boolean {
    val serviceIntent = Intent(SERVICE_ACTION)
    serviceIntent.setPackage(CHROME_PACKAGE)
    val resolveInfos = packageManager.queryIntentServices(serviceIntent, 0)
    return !(resolveInfos == null || resolveInfos.isEmpty())
}

Then open URL in custom tab

if (isChromeCustomTabsSupported()) {
        CustomTabsIntent.Builder().apply {
            setToolbarColor(ContextCompat.getColor(this@MainActivity, R.color.colorPrimary))
            setSecondaryToolbarColor(ContextCompat.getColor(this@MainActivity, R.color.colorPrimaryDark))
        }.build().launchUrl(this@MainActivity, Uri.parse(URL))
    }

If the answer in Kotlin is not OK, i will rewrite in Java

Upd: My answer helps you only in native Android development when you want to launch URL using Chrome on android.

like image 27
Yuri Popiv Avatar answered Sep 22 '22 14:09

Yuri Popiv