Web manifest should include 192px icons

feature
1

It seems Discourse provides a 512px icon in the web manifest JSON file. Under site settings, branding, there is just one manifest icon field which hints that uploaded images will be scaled to 512×512px.

{
   ...
   "icons":[
      {
         "src":"https://community.toph.co/uploads/default/optimized/2X/5/5b9de7676657b71384fb77c662616d73765f0293_2_512x512.png",
         "sizes":"512x512",
         "type":"image/png"
      },
      {
         "src":"https://community.toph.co/uploads/default/optimized/2X/5/5b9de7676657b71384fb77c662616d73765f0293_2_512x512.png",
         "sizes":"512x512",
         "type":"image/png",
         "purpose":"maskable"
      }
   ],
   ...
}

However, according to https://web.dev/add-manifest/:

For Chrome, you must provide at least a 192x192 pixel icon, and a 512x512 pixel icon.

I noticed this is true for Firefox as well (at least on a LineageOS device). Here is what it looks:

photo_2021-04-15_23-25-11
photo_2021-04-15_23-25-11453×605 17.6 KB

Notice the two icons for Toph and Drafts? Both are providing 192px icons (among other sizes). Previously Toph and Drafts several icons but not 192px ones. And, they appeared similar to the icon of Community (i.e. had that dark padding around the white area). The Community app in this screenshot is a Discourse instance.

2

This seems to be an issue with LineageOS, or maybe the version of your browser.

I tested this in Chrome (version 89) and Firefox (version 87) in Android (version 10) and looks fine:

Screenshot from 2021-04-15 23-00-27

Also tested it in Safari:

unnamed
unnamed1125×2001 446 KB

From what I see in the code, seems like you are correct, the only size is 512 px. There are so many devices, browsers and recommended sizes to each one that I guess it’s hard for discourse to cover them all. 512 px seems to work fine for most tough.

4 Likes
3

I have Meta installed as a PWA using both Firefox and Chrome in my phone and the 512px icon works just fine for me.

We could add a task to resize the 512px icon, but if it makes no difference in our officially supported platforms I don’t see the value.

Can you reproduce this with Meta / Android Chrome?

4 Likes