Manifestvalidator voor webapps
Valideer een PWA manifest.json aan de hand van de Web App Manifest-specificatie en bekijk een voorbeeld van maskeerbare pictogrammen in de veilige zone voor adaptieve pictogrammen van Android.
Resultaat
Een Progressive Web App wordt alleen netjes geïnstalleerd als het manifest.json voldoet aan de velden waar browsers en appstores daadwerkelijk op controleren. Deze validator parseert uw geüploade manifest en doorloopt de specificaties van het W3C Web App Manifest veld voor veld: het markeert een ontbrekende naam en korte_naam, een lege of onjuist opgemaakte pictogrammenreeks, pictogrammen waarbij een src, maten of type ontbreken, een onparseerbare start_url, een niet-herkende weergavewaarde en thema_kleur of achtergrond_kleurreeksen die geen geldige CSS-kleuren zijn. Elke bevinding wordt weergegeven als een gewone Engelse zin (geen ruwe specificatie), zodat u precies weet wat u moet oplossen en waarom dit van belang is voor de installeerbaarheid.
De killer-functie is het voorbeeld van de veilige zone met een maskerbaar pictogram. De adaptieve pictogrammen van Android passen een door het besturingssysteem gekozen maskervorm toe (cirkel, cirkel, traan en meer) op elk pictogram dat is gemarkeerd met 'doel': 'maskeerbaar'. Alles buiten een gecentreerde cirkel die 40% van de weergavepoort van het pictogram beslaat, kan worden weggeknipt, afhankelijk van het masker dat het apparaat toepast. Upload de pictogramafbeeldingsbestanden waarnaar in uw manifest wordt verwezen naast manifest.json, en deze tool vergelijkt ze op bestandsnaam, tekent elk maskeerbare pictogram op een canvas op de opgegeven grootte en legt die exacte veilige zone-cirkel over elkaar heen, zodat u met eigen ogen kunt zien of uw kunstwerk de uitsnede overleeft.
De 'geslaagd/mislukt'-badge onder elk voorbeeld is geen cosmetisch checklistitem; het komt voort uit een echte analyse per pixel van de gedecodeerde afbeeldingsgegevens. De tool meet hoeveel niet-achtergrondinhoud zich buiten de cirkel van de veilige zone bevindt (inhoud die door een masker zou worden afgekapt) en hoeveel van het pictogram transparant is (maskeerbare pictogrammen moeten een volledig ondoorzichtige achtergrond hebben, omdat transparantie de onderliggende maskerkleur doorlaat). Beide controles worden uitgevoerd op basis van de daadwerkelijke bitmap die u heeft geüpload, dus het resultaat weerspiegelt uw echte pictogrambestand en geen gok.
Alles gebeurt lokaal in uw browser: manifest.json wordt gelezen met de File API, pictogrammen worden gedecodeerd met createImageBitmap of een FileReader/Image fallback, en pixels worden geanalyseerd op een canvas in het geheugen. Er wordt niets naar een server geüpload, wat ertoe doet als uw manifest verwijst naar een nog niet openbare app-naam, interne start_url-paden of pictogrammen die in ontwikkeling zijn.