What's the Problems with Android Oreo?

On August, 21st after the solar eclipse, Google released the final version of Android 8 now known as Android Oreo. The sun wasn’t the only thing that was hidden for a while today, as Progressive Web Apps have acquired new problems. I’ve installed Android 8 on my Google Pixel, and tested a couple of things regarding websites and PWAs and then I got some problems with Android Oreo.

Dive into more app with fewer taps - Android Oreo
Problems with Android Oreo : Android Instant Apps are the only mention to something related to the Web or browser in the Android Oreo website. It seems to repeat last Google IO keynote, where Android Instant Apps appeared as more important than PWAs from an Android’s perspective.

You have to knowHow Android Instant Run Works?

But let me start with good news: software updates can solve most of the problems. The issue is that nobody seemed to care enough about it to do it before the Android release that is currently being delivered to users.

Lets discuss Problems with Android Oreo

Broken Add to Home Screen

Let’s start stating the worst problems: on Opera Mobile, Samsung Internet, and Firefox the “Add to the Home screen” feature is not working. While Firefox is not supporting Web App Manifest yet for standalone display, it supports bookmarks to the Home Screen.

No icon appears after Adding on the Home screen on Samsung Internet and Opera using Oreo

[tmh_article_ads]

 

On these browsers when you add a website or PWA to the Home screen, nothing happens. Nothing. No icon appears, and the browsers seem to understand everything is ok. Web App Banners appears correctly without luck after accepting the icon installation.

My first guess is that the old shortcut API is not working and these browsers had to update to the new Pinned Shortcuts API.

If you had installed icons with these browsers before installing Android 8.0, they would still work after the upgrade. The problem seems to be in the icon installation.

Add to Home Screen” still works correctly on Google Chrome, but from the other browsers we will need to wait for an update at Google Play.

New Installation Process in Chrome

This screen appears after we accept the icon installation dialog
Problems with Android Oreo – This screen appears after we accept the icon installation dialog

Using Google Chrome, we have a new step before actually installing the icon: the home screen place selector. Here we can use “Add automatically” that will find a free spot where to install the icon or you can touch and hold the icon and drop it wherever you want it. The problem is that this new process has a new step that might decrease a little bit installation rate.

The new process involves:
1- Open the menu.
2- Select Add to Home screen.
3- Edit the title and press “Add.”
4- Press “Add Automatically” or touch and hold the icon to place it manually.

See this alsoWhat’s new in Android Studio 3.0 Canary 6

If the Web App Banner appears, steps 1 and 2 will be replaced by one step: press “Add to Home screen” on the banner.

Icons are not what you expect any more

Problems with Android Oreo - The Chrome badge now appears on every PWA icon on the Home Screen
Problems with Android Oreo – The Chrome badge now appears on every PWA icon on the Home Screen

Up to Android 7.1, Chrome and Android were honoring the icon that you set inside the Web App Manifest (or meta tags as a fallback) without any transformation.

Starting with Android Oreo, every shortcut added from Chrome (and potentially other browsers as well, but they are not working now) will have a Chrome badge at the lower right corner of the icon.

This is bad for PWAs as we want to offer the user an app-like experience; the Chrome icon doesn’t help for the user to understand it as an app. And many companies won’t be happy about it.

[tmh_article_ads]

 

The other issue with icons is that if your icon is not a perfect circle with a transparent background, the icon is treated as square and it’s reduced to fit entirely within the boundaries of a white circle. You can see the same PWA icons installed in the same device on Android 7.1 and Android 8:

Android 7 Vs Android 8 : On Android Oreo, icons have the badge and if they are not a perfect centered circle, they are embedded inside a white circular icon, reducing their original size.
Android 7 Vs Android 8 : On Android Oreo, icons have the badge and if they are not a perfect centered circle, they are embedded inside a white circular icon, reducing their original size.

In the previous image, the Lyft, Get Kana! and NASA icons are suffering for this issue while Garbarino, Flipkart and AliExpress keeps their original icons.

I don’t have confirmation but it seems icons for PWAs are following now the App Shortcut Icon Design Guidelines.

Any icon installed previous to Android 8 upgrade maintains the original icon; changes happen if you install the icon after the upgrade.

WebAPK will be our hero

 

Problems with Android Oreo but WebAPK can be savior
Problems with Android Oreo but WebAPK can be savior

While we can’t do anything about it, for now, one solution might appear when WebAPK becomes stable in the future. WebAPK is a new feature in Google Chrome that creates a native Android Package container (APK) and signs it server-side for our PWA. It’s currently available in Chrome under a flag “Improved Add to Home screen” and in Canary by default.

With WebAPK enabled, icons are back to normal as we were used in Android before Oreo. There is no public information yet on when WebAPK will become available but I guess (and hope) that these problems will speed things up.

And WebAPK will solve the issue for Chrome only. Samsung Internet, Opera, Firefox and other browsers will have the same icon problems unless Google opens WebAPK to third-party browsers as Google is the only one that can sign those on-the-fly generated APKs.

Public Open WiFi hotspots now under a VPN

Android supports now a feature that will connect automatically to open access points (those without any security) and it will use a Google VPN as a secure tunnel to increase security. That means that your users will appear to your server as coming from Mountain View, USA. The original IP address is not available in the HTTP headers, so Google is not honoring the X-Forwarded-For header.

Android 8 goodies not available to PWAs

Android Oreo added a couple of things that can be useful for PWAs, but are still out of reach for Web content as of today, such as:

  • Notification Dots: when an app has a pending notification, a dot will appear on the icon.
  • Adaptive Icons: which can display a variety of shapes across different device models. For example, an adaptive launcher icon can display a circular shape on one OEM device, and display a square on another device
  • Notification channels: it will let us define categories of notifications that we want to receive from an app/website.
  • Shortcuts: options that will appear when you touch and hold an icon
Someone though this was a good idea. But Android Oreo has some good ideas we want to see in PWAs. www.flickr.com/photos/jeepersmedia/14206784113
Someone though this was a good idea. But Android Oreo has some good ideas we want to see in PWAs. www.flickr.com/photos/jeepersmedia/14206784113

Any good news?

Before ending the article, I’ve some good news regarding web development on Android 8. Let’s cover them quickly.

Chrome and PWA emulation

You can test everything that I’ve mentioned here even if you don’t have an Android 8 device as of today, Android emulator (available with Android Studio) now includes Google Chrome (version 58).

Android 8 Emulator now includes Chrome for Web and PWA testing, including the ability to connect a Remote Inspector
Android 8 Emulator now includes Chrome for Web and PWA testing, including the ability to connect a Remote Inspector

Picture-in-Picture for video playing

If you have a <video> tag now, PiP is supported in Chrome. I’m not sure it has the right UX now though: you need to open the video in full screen mode and then press the Home Screen. At that point the video will continue playing as a PiP small floating window that you can move around and close it.

PiP works with most HTML5 video tags. Somehow, it’s not working on YouTube so I’m sorry, you won’t be able to watch Despacito again in PiP mode.
PiP works with most HTML5 video tags. Somehow, it’s not working on YouTube so I’m sorry, you won’t be able to watch Despacito again in PiP mode.

Google needs to work harder on PWAs

PWAs with Oreo?
PWAs with Oreo?

We usually criticize Apple a lot regarding support for the Web Platform, but PWAs on other platforms, including Android, are still in early stages. And I’m sorry to say that. I want to say something nicer here.

I tweeted about something similar during last Google I/O where my feeling was Google doesn’t care about PWAs. And I’m saying Google, not Chrome. Weird? Yes.

I know some people at the Chrome team is doing an outstanding job, but some things (such as WebAPK) are taking too much time to get ready.

The Android team doesn’t seem to care too much about PWAs: the support for Instant Apps and the problems stated in this post on today’s release for me are enough probe to say it, and it’s harming a little bit current PWAs’ trust.

I also know some people will reply saying that PWAs are more about Service Workers than about Web App Manifest and the icon installation, but you know… It sounds good, but I don’t think SW alone is selling the PWA idea to companies.

Let’s work on making it work better in the future!

By Tell Me How

It is a technology blog and admin has excellent experience in programming from 5+ year. You can contact us at ceo.tellmehow@gmail.com

Share your thoughts

4 thoughts on “Problems with Android Oreo – 6 Things you need to know”
  1. Thanks to your post, You will have the opportunity to share their photographs with the world and to view photos of other users registered on the application server. If u need a free photoshop alternative that give you a productive solution, photoshop online will be a great option.

Leave a Reply

Loading Facebook Comments ...
Loading Disqus Comments ...