iPhone 12 sizes, MS tile icons, option to disable sandboxing and reducing the number of apple touch icons

README.md

@@ -49,6 +49,8 @@ PWA Asset Generator automates the image generation in a creative way. Having [Pu
 
 * Supports flexible tag formatting and path customization options to comply with various development environments. You can adjust your output using single quotes `--single-quotes`, self-closing tags `--xhtml`, path prefixes `--path` and path overrides `--path-override` 📝
 
+* Supports generating classic web app icons such as favicons `--favicon` and Windows static tiles `--mstile` ⏪
+
 ## Install
 
 ```
@@ -87,13 +89,15 @@ $ pwa-asset-generator --help
     -h --splash-only            Only generate splash screens  [default: false]
     -c --icon-only              Only generate icons  [default: false]
     -f --favicon                Generate favicon image and HTML meta tag  [default: false]
+    -w --mstile                 Generate Windows static tile icons and export a browserconfig.xml file content  [default: false]
     -e --maskable               Declare icons in manifest file as maskable icons  [default: true]
     -l --landscape-only         Only generate landscape splash screens  [default: false]
     -r --portrait-only          Only generate portrait splash screens  [default: false]
     -d --dark-mode              Generate iOS splash screen meta with (prefers-color-scheme: dark) media attr  [default: false]
     -u --single-quotes          Generate HTML meta tags with single quotes  [default: false]
     -x --xhtml                  Generate HTML meta tags by self-closing the tags  [default: false]
     -g --log                    Logs the steps of the library process  [default: true]
+    -n --no-sandbox             Disable sandbox on bundled Chromium on Linux platforms - not recommended  [default: false]
 
   Examples
     $ pwa-asset-generator logo.html
@@ -121,6 +125,7 @@ $ pwa-asset-generator --help
     --splash-only
     --icon-only
     --favicon
+    --mstile
     --maskable false
     --landscape-only
     --portrait-only
@@ -274,7 +279,8 @@ pwa-asset-generator depends on Puppeteer and it's screenshot API for image gener
 
 However, you can use one of the lossless / lossy compression libraries - like [pngquant](https://pngquant.org/) to compress the generated PNG images.
 
-## Troubleshooting
+### Running the CLI command on CI server causes Puppeteer error: "Running as root without --no-sandbox is not supported". How can I disable sandboxing?
+
+When root user has to be used and system sandboxing is not possible on Linux platforms, Chrome should be executed with the `--no-sandbox` [argument for Puppeteer to run](https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md#setting-up-chrome-linux-sandbox).
 
-### "No usable sandbox!" error on Linux
-In case of getting "No usable sandbox!" error on Linux, you need to enable [system sandboxing](https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md#setting-up-chrome-linux-sandbox).
+PAG provides users the `--no-sandbox` option to tackle this issue. Note that there are limitations for this option; it can only be used on Linux platforms and HTML inputs are disabled for security purposes.

package.json

@@ -15,7 +15,7 @@
     "visuals:output-png": "rimraf ./src/__snapshots__/visual/output-png && node ./bin/cli ./static/logo.svg ./src/__snapshots__/visual/output-png -s false -t png -b coral",
     "visuals:output-transparent": "rimraf ./src/__snapshots__/visual/output-transparent && node ./bin/cli ./static/logo.svg ./src/__snapshots__/visual/output-transparent -s false -b -t png transparent -o false",
     "visuals:input-svg": "rimraf ./src/__snapshots__/visual/input-svg && node ./bin/cli ./static/logo.svg ./src/__snapshots__/visual/input-svg -s false -b coral",
-    "visuals:input-png": "rimraf ./src/__snapshots__/visual/input-png && node ./bin/cli ./static/logo.png ./src/__snapshots__/visual/input-png -s false -b coral",
+    "visuals:input-png": "rimraf ./src/__snapshots__/visual/input-png && node ./bin/cli ./static/logo.png ./src/__snapshots__/visual/input-png -s false -b coral -w",
     "visuals:input-html": "rimraf ./src/__snapshots__/visual/input-html && node ./bin/cli ./static/logo.html ./src/__snapshots__/visual/input-html -s false",
     "visuals:input-html-dark": "rimraf ./src/__snapshots__/visual/input-html-dark && node ./bin/cli ./static/logo.html ./src/__snapshots__/visual/input-html-dark -s false -d true",
     "commit": "git-cz",
@@ -32,7 +32,7 @@
     "url": "https://github.com/onderceylan/pwa-asset-generator.git"
   },
   "engines": {
-    "node": ">=10"
+    "node": ">=10.12.0"
   },
   "keywords": [
     "pwa",

src/__snapshots__/cli.test.ts.snap

@@ -10,8 +10,10 @@ exports[`CLI integrates with main API and creates an output with generated meta
 <link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2048-1536.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)\\">
 <link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2224-1668.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)\\">
 <link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2160-1620.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 810px) and (device-height: 1080px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)\\">
-<link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2688-1242.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)\\">
+<link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2778-1284.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)\\">
+<link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2532-1170.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)\\">
 <link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2436-1125.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)\\">
+<link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2688-1242.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)\\">
 <link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-1792-828.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)\\">
 <link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-2208-1242.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)\\">
 <link rel=\\"apple-touch-startup-image\\" href=\\"%PUBLIC_URL%/temp/apple-splash-dark-1334-750.jpg\\" media=\\"(prefers-color-scheme: dark) and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)\\">