# Desktop PWA works with Discourse!

**URL:** https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348
**Category:** Announcements
**Created:** [28 באפריל,‏ 2018,‏ 2:23am UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348 "2018-04-28T02:23:24Z")
**Posts on this page:** 20
**Page:** 2

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [23 במרץ,‏ 2019,‏ 11:11pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/22 "2019-03-23T23:11:02Z")

</div>

Per [Hands-On with Microsoft's New Edge Browser Built on Chromium - Thurrott.com](https://www.thurrott.com/microsoft/203601/hands-on-with-microsofts-new-edge-browser-built-on-chromium)

> When it comes to features, Edge has the one critical item that always kept me crawling back to Chrome. If you are on a webpage, **you can easily turn it into an app, by clicking the three dots in the top right and clicking install app**. This is huge, as it allows me to turn Google Calendar, Tweetdeck, and a few other pages into applications on my desktop that makes my workflow, a lot easier.

🤔 we should definitely whitelist all Chrome based browsers @falco

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [27 במרץ,‏ 2019,‏ 5:52pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/25 "2019-03-27T17:52:47Z")

</div>

Looks like Chrome Canary is experimenting with a more _in your face_ install button:

[https://twitter.com/henrylim96/status/1110916077519699970](https://twitter.com/henrylim96/status/1110916077519699970)

Here is it in Meta when the service worker is working:

 ![destop_pwa_install_meta](https://global.discourse-cdn.com/meta/original/3X/7/0/70dd27b6678cb031d558c467f86ebf77a622d2f9.png)

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [27 במרץ,‏ 2019,‏ 11:56pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/26 "2019-03-27T23:56:02Z")

</div>

Niiiice. We should definitely get this working on Chrome. I like it.

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [22 במאי,‏ 2019,‏ 6:40pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/27 "2019-05-22T18:40:45Z")

</div>

![](https://global.discourse-cdn.com/meta/original/3X/9/8/98df37df387a7e8f9817e82ca7bab4460a4a48ad.gif)

We want to get this working, but the last time we tried with the “You are offline” page wasn’t a great experience. Also we had a lot of [suggestions](https://meta.discourse.org/t/suggestion-offline-mode-pre-loading-discourse-content/115268) about [making](https://meta.discourse.org/t/pocket-offline-reader-support/17500) reading Discourse [possible](https://meta.discourse.org/t/offcourse-a-proof-of-concept-offline-reader-for-discourse/22356) when you are [offline](https://meta.discourse.org/t/exploring-serviceworkers-for-discourse/32422).

Using some libraries from [GitHub - GoogleChrome/workbox: 📦 Workbox: JavaScript libraries for Progressive Web Apps · GitHub](https://github.com/GoogleChrome/workbox) I was able to:

- Remove the “You are offline” page

- Make Discourse fallback to cache when a network request fail aka Discourse will allow offline browsing of every previously visited page.

- Get a perfect score in the PWA Lighthouse audit:

- Get the “Install Site” on the Desktop working (availiable in Chrome canary for now, will land in stable around August)

### Technical Details

The changes are pending in this branch: [https://github.com/discourse/discourse/compare/offline](https://github.com/discourse/discourse/compare/offline)

A demo site is running at [https://discourse-workbox.muito.ninja/](https://discourse-workbox.muito.ninja/)

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [3 ביוני,‏ 2019,‏ 10:38pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/28 "2019-06-03T22:38:25Z")

</div>

Here is a demo of Discourse offline browsing on iPad

[https://giant.gfycat.com/BlushingGreedyGiantschnauzer.mp4](https://giant.gfycat.com/BlushingGreedyGiantschnauzer.mp4)

---

<div class="post-metadata">

### Author: ![csmu](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/csmu/32/124581_2.png) [@csmu](https://meta.discourse.org/u/csmu)
#### Post date: [3 ביוני,‏ 2019,‏ 11:12pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/29 "2019-06-03T23:12:39Z")

</div>

Can you create topics offline that get synced with the server when the device is back online?

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [3 ביוני,‏ 2019,‏ 11:36pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/30 "2019-06-03T23:36:09Z")

</div>

The current changes only affect `GET` requests, so it will make you able to use the composer, if you ever did it while online.

Discourse already keeps submitting a topic in a persistent “Saving” blue bar, and this doesn’t touch that request, so it should keep the current behavior.

However, getting Discourse to work totally in write mode while offline would require a lot more work and be a long term project involving multiple people. That is not the scope here, which is just enabling installs in Desktop.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [13 ביוני,‏ 2019,‏ 9:29pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/31 "2019-06-13T21:29:52Z")

</div>

cc @falco

> In Chrome 76, we’re making it easier for users to install Progressive Web Apps on the desktop by adding an [install button to the omnibox](https://developers.google.com/web/updates/2019/06/pwa-install-addressbar).
> 
> ![image](https://global.discourse-cdn.com/meta/original/3X/f/7/f78d92076cd85ce40b39793640ba0b8096a6f4a4.jpeg)

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [26 ביוני,‏ 2019,‏ 6:54pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/33 "2019-06-26T18:54:23Z")

</div>

Okay, this is live in Meta for testing now. Please report any crazyness.

Here is Meta install:

[https://global.discourse-cdn.com/meta/original/3X/0/9/099b273eaacaee4f9d284b17e4358b9322717256.mp4](https://global.discourse-cdn.com/meta/original/3X/0/9/099b273eaacaee4f9d284b17e4358b9322717256.mp4)

---

<div class="post-metadata">

### Author: ![Stephen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stephen/32/95011_2.png) [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [26 ביוני,‏ 2019,‏ 10:56pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/34 "2019-06-26T22:56:25Z")

</div>

Is there a flag we can set to tinker with this on our own installations?

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [26 ביוני,‏ 2019,‏ 11:02pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/35 "2019-06-26T23:02:36Z")

</div>

It’s in the same branch as always [here](https://github.com/discourse/discourse/compare/offline). You could deploy from that branch but it is a lot behind master currently. I can rebase it to master, but I don’t recommend messing with this until it’s proven stable here.

Another cool thing, if you try to use the pwa with a cold cache:

 ![Screenshot_20190626-173124](https://global.discourse-cdn.com/meta/original/3X/c/1/c1acf06620874ed0f0d179ec27b6517f88d175e6.jpeg)

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [16 ביולי,‏ 2019,‏ 5:29pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/36 "2019-07-16T17:29:58Z")

</div>

This is live on latest Discourse `tests-passed`.

Please report any #Contribute > Bug in new topics.

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [31 ביולי,‏ 2019,‏ 9:38pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/38 "2019-07-31T21:38:53Z")

</div>

Chrome 76 was launched yesterday with the Install call to action in the omnibar, and latest Discourse works with it out of the box.

> **[New in Chrome 76  |  Blog  |  Chrome for Developers](https://developer.chrome.com/blog/new-in-chrome-76/)**
>
> Chrome 76 is rolling out now! It adds support for the prefers-color-scheme media query, bringing dark mode to websites. An install button in the omnibox to make installation of Progressive Web Apps on desktop easier. A way to prevent the mini-infobar...

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [1 באוגוסט,‏ 2019,‏ 12:15am UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/39 "2019-08-01T00:15:21Z")

</div>

Confirmed working in Chrome 76 released today, there’s even a fairly complex animation in the address bar ❗ which calls attention to it.

 ![image](https://global.discourse-cdn.com/meta/original/3X/9/0/90f86832aaf487041ba88232992bd0e0f3b46fad.png)

Looks like the animation only happens once per domain though.

This is technically shipped but I still view it as rather experimental so I am re-opening the topic.

> **[Progressive Web Apps browser support & compatibility](https://www.goodbarber.com/blog/progressive-web-apps-browser-support-compatibility-a883/)**
>
> Progressive Web Apps browser support & compatibility : find a list of Features vs Browsers vs OS compatibilities, available for PWA based mobile apps.

---

<div class="post-metadata">

### Author: ![seanblue](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@seanblue](https://meta.discourse.org/u/seanblue)
#### Post date: [8 באוגוסט,‏ 2019,‏ 3:09am UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/41 "2019-08-08T03:09:15Z")

</div>

Is there a way to dismiss the icon in the address bar, either from Discourse or from Chrome? I prefer to just use the browser, so I don’t see the point in having that icon visible forever.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [8 באוגוסט,‏ 2019,‏ 3:20am UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/42 "2019-08-08T03:20:31Z")

</div>

Probably a question better directed towards the Chrome browser developers, not us.

---

<div class="post-metadata">

### Author: ![seanblue](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@seanblue](https://meta.discourse.org/u/seanblue)
#### Post date: [8 באוגוסט,‏ 2019,‏ 3:44am UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/43 "2019-08-08T03:44:04Z")

</div>

I’ve been googling around on the Chrome side, but couldn’t find anything. So I guess I’ll ask them.

Is this something that could theoretically be dismissable (e.g. with localstorage) or hidden permanently based on a Discourse setting? I’m asking because I don’t know if Chrome automatically detects if the website is compatible as a PWA or if there’s some flexibility on your end to only offer the option conditionally.

---

<div class="post-metadata">

### Author: ![seanblue](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@seanblue](https://meta.discourse.org/u/seanblue)
#### Post date: [8 באוגוסט,‏ 2019,‏ 9:21pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/44 "2019-08-08T21:21:07Z")

</div>

For anyone else interested, there’s a setting in `chrome://flags` called `App Banners` which you can set to `Disabled` to remove the icon in the address bar.

EDIT: Actually, the relevant setting seems to be `Desktop PWAs installable from the omnibox`.

---

<div class="post-metadata">

### Author: ![Mevo](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mevo/32/187732_2.png) [@Mevo](https://meta.discourse.org/u/Mevo)
#### Post date: [20 באוגוסט,‏ 2019,‏ 3:33pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/45 "2019-08-20T15:33:33Z")

</div>

Just for information, today on Chrome on linux (Ubuntu) I even had a popup to propose me to “install” discourse as an app. Something similar to the popups when websites ask to allow notifications.

Is Chrome trying to push for these kind of “installations” ?

---

<div class="post-metadata">

### Author: ![Falco](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/falco/32/179432_2.png) [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [20 באוגוסט,‏ 2019,‏ 4:50pm UTC](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348/46 "2019-08-20T16:50:29Z")

</div>

A popup in desktop!?

Do you have a screenshot?

[Previous page](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348.md?page=1)

[Next page](https://meta.discourse.org/t/desktop-pwa-works-with-discourse/86348.md?page=3)
