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 , , , ,

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
Comments (42)

42 responses to “Hands On: Beta PWA Support in Chrome OS”

  1. Avatar

    Bats

    I just did the Starbucks PWA , using Windows 10 and the Chrome browser..... without doing any of those instructions. I just logged into my Starbucks account on their site and I got exactly what Paul got. What am I missing here?

  2. Avatar

    maethorechannen

    Can you pre-order with the Starbucks PWA? That was the biggest functional difference I noticed between the Windows Mobile and Android versions of the app and I'm wondering if the WM version of the app was really just this website version in an appx.

  3. Avatar

    Stooks

    I am just not feeling the PWA love.


    Do they support the native OS features, like keyboard shortcuts and what not for say Mac OS or Windows etc? That is just one example of why native apps are better than web apps. Most web apps don't support native keyboard shortcuts or other OS app integration like outputting/sending something to another native app.


    I do want Microsoft to port all of their apps to PWA's so I can dump Windows faster.

    • Avatar

      Ugur

      In reply to Stooks: I don't get this level of hatred (and then browsing this site) but you bring up a valid point, i'd like to know, too, if these support things one would expect from regular desktop apps like a right click menu with the typical contents of those, keyboard shortcuts etc. Because that was one of the things that annoyed me most about UWP apps, too, that even MS own ones lack those features one would totally expect from regular desktop apps. Like i wrote a comment before about the aspects i liked in the video editing features added to the photos app but at the same time already back then it annoyed me that it didn't even have to be seen as stsandard and basic desktop app features like copy, duplicate and save a project file.

      Now with PWAs all nice and good if they feel better/more native than older web apps, but to be seen as proper desktop apps they also have to support such features, like right click menu features, keyboard shortcuts, copy and save and paste between apps etc.


      • Avatar

        Stooks

        In reply to Ugur:

        Hatred? You mean my Windows comment. Sorry after two years I am just not a fan of Windows 10. I could not stand Windows 8 even more. I was a Windows fan from Windows 286 - Windows 7. Now I need it less and I simply do not like the current version.


        On the PWA subject. Microsoft moving its apps to PWA, only helps Google. If you can run Office or something like Viso on a Chromebook, why would you buy and more expensive and more complex (to take care of) Windows computer????

        • Avatar

          Lauren Glenn

          In reply to Stooks:

          I like Windows 10 (and even 8) for two basic things.... I can just take the drive out, put it in a new PC that was already licensed, and it fixes itself automatically. Windows 7 can't do that.


          Any upgrade that fails reverts itself back to a good working state. No BSOD during boot up. Never had one that didn't fix itself on a reboot.

          • Avatar

            Stooks

            In reply to alissa914g:

            Nice feature but lest be hones, how many people take their drive out and move it to a new computer and hope everything works? 1% of 1%?

            • Avatar

              NazmusLabs

              In reply to Stooks:

              It's not about this particular feature. It's just a consequence of the fact that how much more advanced and resillient the Windows 10 kernal is. This is just one effect of the more robust OS kernal Windows 10 has. Another is to be able to translate linux sys commands natively. Windows 10 is beat and blows Windows 7 out of the water in pure technology prospective...whereas Windows 7 doesn't even understand USB 3 natively...so sad...so old...so time to leave that dusty old rag behind.

          • Avatar

            CajunMoses

            In reply to alissa914g:Wow! The concept of having to "fix" an OS is completely foreign to me as a Chrome OS user. Why would anyone willfully continue using Windows, let alone express such devotion, loyalty, and deep satisfaction? It really epitomizes brainwashing.


    • Avatar

      NazmusLabs

      In reply to Stooks:

      They support keyboard shortcuts. Support file system access, offline functionality.


      Look, for apps like a banking app, or a Starbucks app, we don't need keyboard shortcuts anyway. For simpler app clients for online services, it makes no sense to build native apps anymore. Wrote once run everywhere.


      • Avatar

        Stooks

        In reply to NazmusLabs:

        And it makes no sense to use a PWA when I can just go to the banking website. On my iPhone the native, banking app I have uses my camera to process paper checks. Will a PWA version do the same thing?

        • Avatar

          NazmusLabs

          In reply to Stooks:

          To answer your question, yes, PWA wil be able to use your devices camera and process checks. ;) PWA can also run completely offline without any internet connection, whereas trying to do so with a browser will give you an HTTTPS error.


          See, this is where your misunderstanding was coming from. It didn't make sense to you because you didn't fully understand what PWA is. PWA isn't just the website in a browserless chrome. PWA allows the website to start using the local machine's hardware.

  4. Avatar

    petrolemo

    I noticed something interesting. Google may be planning to market this as a more "appy" version of the existing Lite mode. In the PWA (in both Chrome and Edge), Google claims you are in Lite mode at the very bottom of the left nav menu. So I clicked it and it took me to the Help page for Lite mode. Then I clicked the Lite link in the Help page, and Lite is nearly the same as the PWA, but without the round icons, but it has the same simplified menu as the PWA.

    Lite mode Help page

    https://support.google.com/maps/answer/3031966?p=litemode&hl=en&visit_id=1-636549087616297045-3449246714&rd=1

  5. Avatar

    mrdrwest

    Paul, I see a conflict.


    PWA - hamburger menu is on the right.

    UWP - hamburger menu on the left.


    This does NOT instill confidence; not at all...SMH...

  6. Avatar

    SoundersFan

    In Chrome on Windows, "More Tools->Save As..." saves the html to the desktop. What you want is "Add to desktop...". This works with the Starbucks PWA. However I wasn't able to get the maps.google.com/?force=pwa to work for me in Windows with Chrome. I could add it to the desktop, but when I click on the "Google Maps" link on the desktop, it launches in Chrome in a tab. Starbucks, on the other hand, launched like an app (that is, no tabs) using the same procedure.

  7. Avatar

    Waethorn

    This isn't much different than the "open as window" option in Chrome.

  8. Avatar

    mackrevinack

    sorry but this website is trashy af. every time i open a page i get a popup from lastpass. then another pop about some webinar that ive clicked no to a few hundred times. whats the deal? are you actually trying to put people of reading your articles?

  9. Avatar

    dcdevito

    PWAs are simply the future of computing, for both personal and the enterprise. I'm in the midst of rolling out three major app upgrade projects, all of which are web apps replacing desktops clients. When this is done I will have ZERO internally supported clients with desktop apps. The biggest challenge is getting the user onto the damn apps, and PWAs solve a lot of these issues for me. The neat part is, users don't know the difference (they're not tech savvy), and I get to have mobile counterparts to accompany these apps. It's a win-win. I glad to see this starting to take flight in personal computing, and glad to see Google embracing them, it can only help bolster Chromebooks.

    But this is BAD for Apple :)

  10. Avatar

    Bart

    Paul,


    pwa.rocks is a website that has a few pwa's on it. The Financial Times app is particularly nice.


    Btw: anyone on an Insider build (Fast Ring) can have a look at these

  11. Avatar

    Sprtfan

    Do you think that Google will let its Google Maps PWA be put into the Windows 10 store?

    • Avatar

      gabbrunner

      In reply to Sprtfan:

      What I was wondering too. Are gmail, maps, inbox etc. technically web apps?

    • Avatar

      RamblingGeek

      In reply to Sprtfan:
      The would have to block it by browser type.. which would just be wrong, but you never know. I hope not. Acording to Paul, MS and Google have been working together on so much so Google Demo'ed YouTube on Windows 10 as a PWA.


      • Avatar

        Sprtfan

        In reply to RamblingGeek:

        I expect that it would work on Windows but I was asking if it would be added to the Windows Store? I believe the developer has to give Microsoft permission to be added to the store. Probably not a huge deal since I'd expect it to work no matter what but would make discover-ability better and could come into play down the road with Andromeda and would also help with the perception of the store.

        • Avatar

          SocialDanny123

          In reply to Sprtfan:

          Nope. Microsoft can actually simply add it to the Store. No developer intervention required. TBH I doubt the developers would care at all if their PWA was added.

          • Avatar

            Sprtfan

            In reply to SocialDanny123:

            I thought Paul had mentioned several times that the developer had to include something in the PWA when it was made that gave them permission to add it to the store. The point was that it was very easy for the developer to do, but they still had control of if it was in the store or not.


            Edit: I found the info I was thinking of. If a developer does not want their app to be put in the store they can add 2 lines in the Web App Manifest that will keep the PWA from being added into the store.


            We completely understand that some of you may not want your products automatically added to the Store and we respect that. By adding these 2 lines to your site’s robots.txt file, the Bing Crawler will ignore your Web App Manifest, opting your site out of this process:


            Not sure why they would want to but they have the option to not be included if they choose. Hopefully we are to the point that Google wouldn't exclude itself but I would be shocked either.

  12. Avatar

    tom_james

    Paul, the menu option to save the PWA link using Chrome on Windows is actually "More tools > Add to desktop..." (not More tools > Save page as...").

  13. Avatar

    Ron Diaz

    Google is following Microsoft in regards to PWA?

    Umm, exactly how are you figuring that?

  14. Avatar

    SherlockHolmes

    I still dont see a use for it on a PC.

  15. Avatar

    mortarm

    I guess I'm not getting the big deal. Since most live in the browser anyway, what's the real advantage with PWA's?

Leave a Reply