Desktop PWA works with Discourse!

Per Hands-On with Microsoft's New Edge Browser Built on Chromium - Thurrott.com

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.

:thinking: we should definitely whitelist all Chrome based browsers @falco

8 лайков

Looks like Chrome Canary is experimenting with a more in your face install button:

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

13 лайков

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

6 лайков

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 about making reading Discourse possible when you are offline.

Using some libraries from GitHub - GoogleChrome/workbox: 📦 Workbox: JavaScript libraries for Progressive Web Apps 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)

    image

Technical Details

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

A demo site is running at https://discourse-workbox.muito.ninja/

27 лайков

Here is a demo of Discourse offline browsing on iPad

14 лайков

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

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.

9 лайков

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.

16 лайков

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

Here is Meta install:

6 лайков

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

4 лайка

It’s in the same branch as always here. 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:

13 лайков

Это работает на последней версии Discourse tests-passed.

Пожалуйста, сообщайте о любых #багах в новых темах.

12 лайков

Chrome 76 был выпущен вчера с кнопкой «Установить» в адресной строке, и последняя версия Discourse работает с ним из коробки.

15 лайков

Подтверждено, что работает в Chrome 76, выпущенном сегодня. В адресной строке даже есть довольно сложная анимация :exclamation:, привлекающая к ней внимание.

Похоже, анимация срабатывает только один раз для каждого домена.

Технически функция уже выпущена, но я всё ещё считаю её довольно экспериментальной, поэтому снова открываю тему.

11 лайков

Можно ли убрать иконку в адресной строке — либо через настройки Discourse, либо через Chrome? Я предпочитаю пользоваться только браузером, поэтому не вижу смысла, чтобы эта иконка была видна постоянно.

Скорее всего, это вопрос, который лучше адресовать разработчикам браузера Chrome, а не нам.

7 лайков

Я уже поискал информацию в Google по поводу Chrome, но ничего не нашёл. Так что, думаю, стоит спросить у них напрямую.

Можно ли теоретически отключить это (например, через localStorage) или скрыть навсегда на основе настройки Discourse? Я спрашиваю, потому что не знаю, определяет ли Chrome автоматически, что сайт совместим с PWA, или же у вас есть возможность предлагать эту опцию только при определённых условиях.

Для всех остальных, кому это интересно, в chrome://flags есть настройка под названием App Banners, которую можно установить в Disabled, чтобы убрать значок в адресной строке.

РЕДАКТИРОВАНИЕ: На самом деле, соответствующая настройка, похоже, называется Desktop PWAs installable from the omnibox.

7 лайков

Только для информации: сегодня в Chrome на Linux (Ubuntu) у меня даже появилось всплывающее окно с предложением «установить» Discourse как приложение. Что-то вроде всплывающих окон, когда сайты запрашивают разрешение на отправку уведомлений.

Неужели Chrome пытается продвигать такие «установки»?

Всплывающее окно на рабочем столе!?

У вас есть скриншот?

4 лайка