Hands On: Beta PWA Support in Chrome OS

Posted on February 22, 2018 by Paul Thurrott in Cloud, Dev, Mobile, Windows 10 with 42 Comments

I recently discussed how Google is following Microsoft in supporting Progressive Web Apps (PWAs) on the desktop, in this case in Chrome OS. Here’s an early peek at how this works.

The PWA support I’m describing here will be coming to Chrome officially in one of the upcoming releases. But you can access it now if you’re running a Canary or Dev channel build. So you’ll need to switch from the normal Stable channel.

My Acer Chromebook 14 for Work is already configured for the Dev channel so I can check out new features early. But if you have a Chromebook and would like to check this out too, open Settings and navigate to About Chrome OS > Detailed build information > Channel and make the change.

Next, you have to enable the Desktop PWAs flag in Chrome Flags. To do that, navigate to chrome://flags in a browser window and then search forPWAs. Find the Desktop PWAs flag in the results, enable it, and then restart the browser as prompted.

OK, let’s find some PWAs. This is a bit difficult in Chrome OS since they aren’t integrated with an app store. So I did a Google search and came up with a couple of options that aren’t Twitter Lite. (Since I already am using that and it’s one of the only well-known examples of a PWA.)

First up: Starbucks, which is available at app.starbucks.com. After loading the site and signing in, I selected “Add to shelf…” from the Chrome menu. (This is unique to Chrome OS. If you’re using Chrome on Windows, you can choose More tools > Save page as” to add the site to your list of Chrome apps and create a shortcut that can be pinned to the taskbar.)

Now, when you launch Starbucks, it looks and works like a native app: It has its own shortcut in the Chrome launcher (like the Windows Start menu) and in the taskbar. And the app window takes on the color scheme of the site, in this case, green.

Unlike pinned Chrome websites (in Windows or Chrome OS), this app window also provides a basic menu of options that are available via a widget next to the minimize, restore, and maximize buttons. This menu lets you perform some useful actions like set a zoom size that is unique to this app. The app info option lets you manage the app: You can unpin it from the shelf (taskbar) or remove it from Chrome entirely.

Google Maps is also available as a PWA, though as Kenneth Christiansen explains, you have to use a specific URL (maps.google.com?force=pwa) and the browser’s developer tools (Toggle device toolbar > Application > Service Workers, and then enable both “Update on reload” and “Bypass for network”) for this to work properly right now. (Remember, this is early days.)

Once you get through all that, you can add this PWA to the shelf too. And then configure the shortcut to open as a window (and not as a tab). Voila: A blue color scheme and that app menu widget are present.

So, this is exciting stuff. And an interesting look at how PWAs should look and work on Windows 10, too, I think. Of course, the even bigger deal there is Store support, and the fact that most people won’t even know that they’re using web apps. All they’ll know is that the app selection suddenly got a lot better.

It’s going to be a great year for apps.

 

Tagged with , , , ,

Elevate the Conversation!

Join Thurrott Premium to enjoy our Premium comments.

Premium member comments on news posts will feature an elevated status that increases their visibility. This tab would allow you to participate in Premium comments with other premium members. Register to join the other Premium members in elevating the conversation!

Register or Subscribe

Join the discussion!

BECOME A THURROTT MEMBER:

Don't have a login but want to join the conversation? Become a Thurrott Premium or Basic User to participate

Register