diff --git a/web/public/icons/icon-maskable-compact-512.png b/web/public/icons/icon-maskable-compact-512.png new file mode 100644 index 0000000..57dcc06 Binary files /dev/null and b/web/public/icons/icon-maskable-compact-512.png differ diff --git a/web/public/manifest.webmanifest b/web/public/manifest.webmanifest index 36b652c..4928dd5 100644 --- a/web/public/manifest.webmanifest +++ b/web/public/manifest.webmanifest @@ -20,6 +20,12 @@ "sizes": "512x512", "type": "image/png", "purpose": "any" + }, + { + "src": "/icons/icon-maskable-compact-512.png", + "sizes": "512x512", + "type": "image/png", + "purpose": "maskable" } ] } diff --git a/web/tests/pwa-manifest.test.mjs b/web/tests/pwa-manifest.test.mjs new file mode 100644 index 0000000..a6862ca --- /dev/null +++ b/web/tests/pwa-manifest.test.mjs @@ -0,0 +1,18 @@ +import assert from 'node:assert/strict'; +import { readFile } from 'node:fs/promises'; +import test from 'node:test'; + +test('PWA icons include a compact adaptive icon', async () => { + const manifest = JSON.parse(await readFile(new URL('../public/manifest.webmanifest', import.meta.url), 'utf8')); + for (const size of ['192x192', '512x512']) { + assert.ok(manifest.icons.some(icon => icon.sizes === size && (icon.purpose ?? 'any').split(/\s+/).includes('any'))); + } + const maskable = manifest.icons.filter(icon => (icon.purpose ?? 'any').split(/\s+/).includes('maskable')); + assert.equal(maskable.length, 1); + assert.equal(maskable[0].sizes, '512x512'); + assert.equal(maskable[0].type, 'image/png'); + const image = await readFile(new URL(`../public${maskable[0].src}`, import.meta.url)); + assert.ok(image.length <= 32 * 1024); + assert.equal(image.readUInt32BE(16), 512); + assert.equal(image.readUInt32BE(20), 512); +});