Валідатор Web App Manifest

Progressive Web App встановлюється коректно лише тоді, коли його manifest.json задовольняє поля, які реально перевіряють браузери та магазини застосунків. Цей валідатор розбирає завантажений маніфест і проходить специфікацію W3C Web App Manifest поле за полем: позначає відсутність name і short_name, порожній або некоректний масив icons, іконки без src, sizes чи type, непридатний для розбору start_url, невідоме значення display, а також рядки theme_color чи background_color, які не є валідними CSS-кольорами. Кожен результат показано звичайним реченням — без цитат зі специфікації — щоб було одразу зрозуміло, що виправити і чому це впливає на встановлюваність.

Головна фішка — прев'ю безпечної зони maskable-іконок. Adaptive-іконки Android застосовують форму маски, обрану операційною системою — коло, сквіркл, крапля та інші — до будь-якої іконки з "purpose": "maskable". Усе, що виходить за межі центрованого кола, яке займає 40% області перегляду іконки, може бути обрізане залежно від маски, застосованої пристроєм. Завантажте файли зображень іконок, на які посилається ваш маніфест, разом із manifest.json — інструмент зіставить їх за іменем файлу, намалює кожну maskable-іконку на canvas у заявленому розмірі та накладе саме те коло безпечної зони, щоб ви на власні очі побачили, чи виживає ваш малюнок після обрізання.

Позначка «пройдено/не пройдено» під кожним прев'ю — не декоративний пункт чекліста, а результат реального попіксельного аналізу декодованих даних зображення. Інструмент вимірює, скільки контенту, що відрізняється від фону, лежить поза колом безпечної зони (контент, який маска обріже), і скільки пікселів іконки прозорі (maskable-іконки мають мати суцільний непрозорий фон на весь canvas, бо крізь прозорість проступає колір маски). Обидві перевірки виконуються на реальному растрі, який ви завантажили, тож результат відображає саме ваш файл іконки, а не здогадку.

Усе відбувається локально у вашому браузері: manifest.json читається через File API, іконки декодуються через createImageBitmap або резервний варіант FileReader/Image, а пікселі аналізуються на canvas у пам'яті. Нічого не надсилається на сервер — це важливо, якщо ваш маніфест містить ще не публічну назву застосунку, внутрішні шляхи start_url або іконки в розробці.