FEATURE: PWA compatibility checks in the Dashboard (#6850)

FEATURE: PWA compatibility checks in the Dashboard (#6850)

diff --git a/app/models/admin_dashboard_data.rb b/app/models/admin_dashboard_data.rb
index 565a61f..5b4ed57 100644
--- a/app/models/admin_dashboard_data.rb
+++ b/app/models/admin_dashboard_data.rb
@@ -98,8 +98,8 @@ class AdminDashboardData
     add_problem_check :rails_env_check, :host_names_check, :force_https_check,
                       :ram_check, :google_oauth2_config_check,
                       :facebook_config_check, :twitter_config_check,
-                      :github_config_check, :s3_config_check, :image_magick_check,
-                      :failing_emails_check,
+                      :github_config_check, :pwa_config_check, :s3_config_check,
+                      :image_magick_check, :failing_emails_check,
                       :subfolder_ends_in_slash_check,
                       :pop3_polling_configuration, :email_polling_errored_recently,
                       :out_of_date_themes, :unreachable_themes
@@ -211,6 +211,15 @@ class AdminDashboardData
     end
   end
 
+  def pwa_config_check
+    unless SiteSetting.large_icon.present? && SiteSetting.large_icon.width == 512 && SiteSetting.large_icon.height == 512
+      return I18n.t('dashboard.pwa_config_icon_warning', base_path: Discourse.base_path)
+    end
+    unless SiteSetting.short_title.present? && SiteSetting.short_title.size <= 12
+      return I18n.t('dashboard.pwa_config_title_warning', base_path: Discourse.base_path)
+    end
+  end
+
   def s3_config_check
     # if set via global setting it is validated during the `use_s3?` call
     if !GlobalSetting.use_s3?
diff --git a/config/locales/server.en.yml b/config/locales/server.en.yml
index 743a573..7c7eb76 100644
--- a/config/locales/server.en.yml
+++ b/config/locales/server.en.yml
@@ -1193,6 +1193,8 @@ en:
     facebook_config_warning: 'The server is configured to allow signup and log in with Facebook (enable_facebook_logins), but the app id and app secret values are not set. Go to <a href="%{base_path}/admin/site_settings">the Site Settings</a> and update the settings. <a href="https://meta.discourse.org/t/configuring-facebook-login-for-discourse/13394" target="_blank">See this guide to learn more</a>.'
     twitter_config_warning: 'The server is configured to allow signup and log in with Twitter (enable_twitter_logins), but the key and secret values are not set. Go to <a href="%{base_path}/admin/site_settings">the Site Settings</a> and update the settings. <a href="https://meta.discourse.org/t/configuring-twitter-login-for-discourse/13395" target="_blank">See this guide to learn more</a>.'
     github_config_warning: 'The server is configured to allow signup and log in with GitHub (enable_github_logins), but the client id and secret values are not set. Go to <a href="%{base_path}/admin/site_settings">the Site Settings</a> and update the settings. <a href="https://meta.discourse.org/t/configuring-github-login-for-discourse/13745" target="_blank">See this guide to learn more</a>.'
+    pwa_config_icon_warning: 'The server is missing a proper large icon which allows users to add a homescreen shortcut to this site on Android devices. Go to <a href="%{base_path}/admin/site_settings/category/all_results?filter=large_icon">the Site Settings</a> and upload an icon of the recommended size.'
+    pwa_config_title_warning: 'The server is missing a short title which allows users to add a homescreen shortcut to this site on Android devices. Go to <a href="%{base_path}/admin/site_settings/category/all_results?filter=short_title">the Site Settings</a> and configure a title of the recommended length.'
     s3_config_warning: 'The server is configured to upload files to S3, but at least one the following setting is not set: s3_access_key_id, s3_secret_access_key, s3_use_iam_profile, or s3_upload_bucket. Go to <a href="%{base_path}/admin/site_settings">the Site Settings</a> and update the settings. <a href="https://meta.discourse.org/t/how-to-set-up-image-uploads-to-s3/7229" target="_blank">See "How to set up image uploads to S3?" to learn more</a>.'
     s3_backup_config_warning: 'The server is configured to upload backups to S3, but at least one the following setting is not set: s3_access_key_id, s3_secret_access_key, s3_use_iam_profile, or s3_backup_bucket. Go to <a href="%{base_path}/admin/site_settings">the Site Settings</a> and update the settings. <a href="https://meta.discourse.org/t/how-to-set-up-image-uploads-to-s3/7229" target="_blank">See "How to set up image uploads to S3?" to learn more</a>.'
     image_magick_warning: 'The server is configured to create thumbnails of large images, but ImageMagick is not installed. Install ImageMagick using your favorite package manager or <a href="https://www.imagemagick.org/script/download.php" target="_blank">download the latest release</a>.'
diff --git a/config/site_settings.yml b/config/site_settings.yml
index afaa044..546ba41 100644
--- a/config/site_settings.yml
+++ b/config/site_settings.yml
@@ -285,6 +285,7 @@ basic:
     default: ''
   short_title:
     default: ''
+    max: 12
   vapid_public_key_bytes:
     default: ''
     client: true
diff --git a/spec/fixtures/images/large_icon_correct.png b/spec/fixtures/images/large_icon_correct.png
new file mode 100644
index 0000000..e453d6f
Binary files /dev/null and b/spec/fixtures/images/large_icon_correct.png differ
diff --git a/spec/fixtures/images/large_icon_incorrect.png b/spec/fixtures/images/large_icon_incorrect.png
new file mode 100644
index 0000000..e750b90
Binary files /dev/null and b/spec/fixtures/images/large_icon_incorrect.png differ
diff --git a/spec/models/admin_dashboard_data_spec.rb b/spec/models/admin_dashboard_data_spec.rb
index 9ba85fe..8df2a32 100644
--- a/spec/models/admin_dashboard_data_spec.rb
+++ b/spec/models/admin_dashboard_data_spec.rb
@@ -192,6 +192,52 @@ describe AdminDashboardData do
     end
   end
 
+  describe 'pwa_config_check' do
+    subject { described_class.new.pwa_config_check }
+
+    it 'alerts for large_icon missing' do
+      SiteSetting.large_icon = nil
+      expect(subject).to eq(I18n.t('dashboard.pwa_config_icon_warning', base_path: Discourse.base_path))
+    end
+
+    it 'alerts for incompatible large_icon' do
+      upload = UploadCreator.new(
+        file_from_fixtures('large_icon_incorrect.png'),
+        'large_icon',
+        for_site_setting: true
+      ).create_for(Discourse.system_user.id)
+      SiteSetting.large_icon = upload
+      expect(subject).to eq(I18n.t('dashboard.pwa_config_icon_warning', base_path: Discourse.base_path))
+    end
+
+    context 'when large_icon is correct' do
+      before do
+        upload = UploadCreator.new(
+          file_from_fixtures('large_icon_correct.png'),
+          'large_icon',
+          for_site_setting: true
+        ).create_for(Discourse.system_user.id)
+        SiteSetting.large_icon = upload
+      end
+
+      it 'alerts for short_title missing' do
+        SiteSetting.short_title = nil
+        expect(subject).to eq(I18n.t('dashboard.pwa_config_title_warning', base_path: Discourse.base_path))
+      end
+
+      it 'returns nil when everything is ok' do
+        upload = UploadCreator.new(
+          file_from_fixtures('large_icon_correct.png'),
+          'large_icon',
+          for_site_setting: true
+        ).create_for(Discourse.system_user.id)
+        SiteSetting.large_icon = upload
+        SiteSetting.short_title = 'title'
+        expect(subject).to be_nil
+      end
+    end
+  end
+
   describe 's3_config_check' do
     shared_examples 'problem detection for s3-dependent setting' do
       subject { described_class.new.s3_config_check }

GitHub sha: f73fe367

I have a feeling very few sites are going to be able to swing the 512x512 requirement … shouldn’t we simply resize to that so if you are 10 pixels off it is not a big deal?

Hopefully this is a reasonable place to report some issues with this feature. The concept of checking & helping us fix settings (and linking directly to them!) is really nice, but this was a bit misleading for us at forums.classicpress.net:

But, we definitely did have a large icon set, and it was definitely larger than 512px:

$ identify icon-gradient-600.png
icon-gradient-600.png PNG 600x600 600x600+0+0 8-bit sRGB 23.6KB 0.000u 0:00.000

At first I thought the message was broken: most services will resize larger images down to the expected size rather than requiring it exactly. Once I saw the code here, I resized the image down to 512px and this message went away.

Then, a new message appeared: “The server is missing a short title which allows users to add a homescreen shortcut to this site on Android devices.”

It looks like this was the last one, but it would be nice to see all of these messages at once, especially if more checks are added in the future.

Our installed version on this server is v2.2.0.beta8 +41.

2 Likes

This was fixed by @davidtaylorhq work

4 Likes