[w3c/manifest] Add a way to query whether there is a UA-provided back button (#693)

As discussed in #673, developers of "display: standalone" (or "minimal-ui") apps cannot be sure of whether a back button will be provided by the user agent (meaning, the browser **or** operating system **or** hardware). For some apps, this is fine, but for others, not having a back button makes it hard to navigate, so they need to add an in-app back button. The problem is, if there is already one provided by the system, this can be redundant, wasting space and looking silly.

At the extreme, this can lead to the "double back button" problem, seen here in the Twitter PWA currently [installable from the Microsoft Store](https://www.microsoft.com/en-us/p/twitter/9wzdncrfj140) on Windows 10 (this internally uses https://mobile.twitter.com/):

![image](https://user-images.githubusercontent.com/228433/41394569-c44a3330-6fed-11e8-9ea9-13f72deb39b5.png)

We can discuss ways to let developers *control* whether a back button is shown in #673; here I want to propose that we give developers a way to *query* whether a back button is shown. Thus Twitter and other apps can conditionally show an in-app back button, depending on whether there is already a system one. Giving a standard way to check this means we can avoid problematic user-agent detection, or viewport-size detection (which is just as bad for compatibility --- that's what Twitter does today).

## Proposal

I propose a [CSS media feature](https://www.w3.org/TR/mediaqueries-4/#mq-features) which says whether a back button is currently provided by the user agent. The precedent for this is the [`display-mode`](https://www.w3.org/TR/appmanifest/#the-display-mode-media-feature) media feature already in the Manifest spec.

The proposed feature is named `navigation-controls` with possible values {`'none'` | `'back-button'`}, (for example, allowing it to be extended later with `'back-and-forward'`), but it is designed to be used in a [Boolean context](https://www.w3.org/TR/mediaqueries-4/#mq-boolean-context) so all future values would imply the presence of the back button. Thus, you could use it like this to show a back button if-and-only-if there isn't already a system-provided one:

```css
@media navigation-controls {
  #go-back {
    display: none;
  }
}
```

(Note: I use an enum instead of a Boolean due to [this note in Media Queries](https://www.w3.org/TR/mediaqueries-4/#grid): "The <mq-boolean> type exists only for legacy purposes. If this feature were being designed today, it would instead use proper named keywords for its values.")

`navigation-controls` would always be available (even when not in a PWA's standalone window), generally having the `back-button` value when in a normal browser, and an appropriate value in a stand-alone window. It could change dynamically, for example if the UA shows and hides the back button depending on whether there is navigation history.

This would live in the Manifest spec, for now (as with `display-mode`), but probably eventually belongs in the Media Queries spec.

## The Android quirk

There's a bit of a quirk with Android, which is that native apps are generally expected to *show* a back button even though the system has its own back button along the bottom. I believe Twitter is leaning into this pattern with their PWA.

This pattern is quite unique on Android. All other platforms either a) have a system back button, and don't expect apps to provide their own (e.g., Windows 10), or b) don't have a system back button, and expect apps to provide their own (e.g., iOS).

Since this is unique on Android, I think it's appropriate to ask developers to use User-Agent detection if they want to carry forward this pattern. I usually don't like recommending UA detection, but in this case, it is literally a developer saying "I want to show my back button if and only if the user agent does not provide a back button, or on Android where there is a convention to do so despite the system back button already existing." Because the developer is explicitly thinking about Android, it makes sense to explicitly mention Android in their code.

I wouldn't want to have Android browsers show `navigation-controls: none` on Android (a lie) based on the assumption that apps will want to show a redundant back button.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/manifest/issues/693