Install web apps with the new HTML install element

https://developer.chrome.com/blog/install-element-ot

by pentagrama • 2 months ago

32 14 2 months ago

developer.chrome.com

bityard• 2 months ago

Not answered in TFA: What does it mean to "install" a web app in Chrome?

It means the site is saved to your home screen (on mobile) or taskbar/dock (on desktop). When opened that way, it appears in a window with minimal browser chrome and with the site's icon and branding instead of the browser's, so it somewhat resembles a native app (even though under the hood the browser is still doing all the work). Sites that offer this will often also use a Service Worker to remain functional in the absence of an internet connection, since native apps are usually expected to do that; these and some other web APIs are often conceptually bundled together under the term "progressive web apps", originally coined by Google. See https://developer.mozilla.org/en-US/docs/Web/Progressive_web... for more.

I would expect web developers these days to mostly be aware of this, since it's been in widespread use for a while, so I didn't find it odd that the article assumed that level of background.

CharlesW• 2 months ago

…"progressive web apps", originally coined by Google.

To make it a bit less faceless while humans still matter, it was coined by Alex Russell and Frances Berriman in 2015. Russell worked at Google at the time, Berriman at Code for America.

bigiain• 2 months ago

Until I see support in other browsers, I'll assume this is as useful as Internet Explorer Silverlight apps.

Perhaps usable in an entirely locked down corporate environment where centralised IT with "standard desktop builds" and MDM will enforce Chrome use. But without at least Safari support, and ideally Firefox (plus forks), this remains a useless toy to me.

doublerabbit• 2 months ago

Browsers shouldn't have an install. Can we stop half-baked HTML XML syntax at this point?

I forsee abuse of such:

    const button = document.querySelector('install');
    button.addEventListener('promptdismiss', () => {
      console.log('User dismissed the install prompt but forcing installation of adware, malware and bitcoing mining anyway');
    });

llbbdd3• 2 months ago

This isn't possible, the PWA install flow is managed by the browser.

nixosbestos2• 2 months ago

Since apparently this thread needs context, yes, you can install PWAs from Firefox on Android and I've heard it's returning to desktop.

This just seems to be a way (in Chrome) to trigger the already existing PWA install flow but from some styles element on the page, rather than the user knowing how to trigger the install flow (usually multiple clicks).

Edit: I wonder if you could do some click-jacking attacks here...

EffrafaxOfWug• 2 months ago

can install PWAs from Firefox on Android

The last time I checked firefox on android didn't support PWAs like Chrome does. It just creates a shortcut to your homescreen. Chrome on android use WebAPKs. You can verify this by looking at the package id in the app info of the created shortcut.

nixosbestos2• 2 months ago

I guess I don't get the distinction? That's some Google-y Chrome-y sounding stuff if I've ever heard of it.

I don't really get it. I click Install in Firefox. I get an app icon. It works, :shrug: ?

Zardoz842• 2 months ago

the browser's control over the button's label text, language, and appearance means it can trust the user's click as a genuine signal of intent.

Like we don't saw fake download bottons imitating the legitime button.

llbbdd3• 2 months ago

Prompting for installation opens a dialog controlled and populated by the browser that has the name and author of the app to be installed. You can test it on the example page here, linked from the article:

https://microsoftedge.github.io/Demos/pwa-install-element/in...

Zardoz842• 2 months ago

That not avoid you clicking a fake button imitatatin the good button.

lanycrost• 2 months ago

After x years you'll have one prompt element which will create a whole website

Install web apps with the new HTML install element

Related Stories