Update manifest file extension

README.md

@@ -95,7 +95,7 @@ In combination with [html-webpack-plugin](https://github.com/jantimon/html-webpa
 <link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png">
 <link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png">
 <link rel="icon" type="image/png" sizes="228x228" href="/assets/coast-228x228.png">
-<link rel="manifest" href="/assets/manifest.json">
+<link rel="manifest" href="/assets/manifest.webmanifest">
 <link rel="shortcut icon" href="/assets/favicon.ico">
 <link rel="yandex-tableau-widget" href="/assets/yandex-browser-manifest.json">
 <meta name="apple-mobile-web-app-capable" content="yes">
@@ -232,7 +232,7 @@ This behaviour can be adjusted by setting the favicons `mode` and `devMode` opti
 
 ### Custom manifests
 
-The manifest options allows to overwrite values of the generated manifest.json with own values
+The manifest options allows to overwrite values of the generated manifest.webmanifest with own values
 
 ```javascript
 const FaviconsWebpackPlugin = require('favicons-webpack-plugin')
@@ -241,7 +241,7 @@ plugins: [
   new FaviconsWebpackPlugin({
     logo: './src/logo.png',
     mode: 'webapp',
-    manifest: './src/manifest.json'
+    manifest: './src/manifest.webmanifest'
   })
 ]
 ```

example/custom-manifest/webpack.config.js

@@ -22,7 +22,7 @@ module.exports = (env, args) => {
       }),
       new FaviconsWebpackPlugin({
         logo: './src/favicon.png',
-        manifest: './src/manifest.json',
+        manifest: './src/manifest.webmanifest',
         mode: 'webapp'
 
       }),

src/index.js

@@ -182,7 +182,7 @@ class FaviconsWebpackPlugin {
           compilation.fileDependencies.add(logoMaskable);
         }
 
-        // Watch for changes to the base manifest.json
+        // Watch for changes to the base manifest.webmanifest
         if (typeof this.options.manifest === 'string') {
           compilation.fileDependencies.add(this.options.manifest);
         }
@@ -439,9 +439,9 @@ class FaviconsWebpackPlugin {
 
     // If the manifest is not empty add it also to the light mode
     if (Object.keys(baseManifest).length > 0) {
-      tags.push('<link rel="manifest" href="manifest.json">');
+      tags.push('<link rel="manifest" href="manifest.webmanifest">');
       assets.push({
-        name: path.join(outputPath, 'manifest.json'),
+        name: path.join(outputPath, 'manifest.webmanifest'),
         contents: new RawSource(
           JSON.stringify(
             mergeManifests(baseManifest, {
@@ -507,7 +507,7 @@ class FaviconsWebpackPlugin {
     });
 
     const modifiedFiles = files.map((file) => {
-      if (file.name.endsWith('manifest.json')) {
+      if (file.name.endsWith('manifest.webmanifest')) {
         const generatedManifest = JSON.parse(file.contents);
 
         return {
@@ -600,7 +600,7 @@ function getResolvedPublicPath(logoContentHash, compilation, faviconOptions) {
 }
 
 /**
- * Merge two manifest.json files
+ * Merge two manifest.webmanifest files
  *
  * @param {{[key: string]: any}} manifest1
  * @param {{[key: string]: any}} manifest2

src/options.d.ts

@@ -55,7 +55,7 @@ export interface FaviconWebpackPlugionOptions {
    * which are websites that can be installed to a device’s homescreen without an app store.
    * @see https://developer.mozilla.org/en-US/docs/Web/Manifest
    * 
-   * The manifest option allows to provide a filepath to a base manifest.json file or a base manifest configuration
+   * The manifest option allows to provide a filepath to a base manifest.webmanifest file or a base manifest configuration
    */
   manifest?: string | { [key: string]: any }
   /**

test/_util.mjs

@@ -75,7 +75,7 @@ export const snapshotCompilationAssets = (t, compilerStats) => {
     assetNames.map((assetName) => replaceHash(replaceBackSlashes(assetName)))
   );
   const htmlFiles = /\.html?$/;
-  const textFiles = /\.(json|html?|webapp|xml)$/;
+  const textFiles = /\.(json|html?|webapp|xml|webmanifest)$/;
   // CSS and JS files are not touched by this plugin
   // therefore those files are excluded from snapshots
   const ignoredFiles = /\.(js|css)$/;

test/manifest.file.test.mjs

@@ -21,7 +21,7 @@ test('should generate a result with custom manifest values', async (t) => {
     plugins: [
       new FaviconsWebpackPlugin({
         logo,
-        manifest: path.resolve(fixtures, 'manifest.json'),
+        manifest: path.resolve(fixtures, 'manifest.webmanifest'),
       }),
     ],
   });

test/manifest.light.file.test.mjs

@@ -22,7 +22,7 @@ test('should generate a result with custom manifest values', async (t) => {
       new FaviconsWebpackPlugin({
         logo,
         mode: 'light',
-        manifest: path.resolve(fixtures, 'manifest.json'),
+        manifest: path.resolve(fixtures, 'manifest.webmanifest'),
       }),
     ],
   });

test/snapshots/default.test.mjs.md

@@ -301,7 +301,71 @@ Generated by [AVA](https://avajs.dev).
       },
       {
         assetName: 'assets/manifest.webmanifest',
-        content: 'binary assets/manifest.webmanifest',
+        content: `{␊
+          "dir": "auto",␊
+          "lang": "en-US",␊
+          "display": "standalone",␊
+          "orientation": "any",␊
+          "start_url": "/?homescreen=1",␊
+          "background_color": "#fff",␊
+          "theme_color": "#fff",␊
+          "icons": [␊
+            {␊
+              "src": "android-chrome-36x36.png",␊
+              "sizes": "36x36",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-48x48.png",␊
+              "sizes": "48x48",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-72x72.png",␊
+              "sizes": "72x72",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-96x96.png",␊
+              "sizes": "96x96",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-144x144.png",␊
+              "sizes": "144x144",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-192x192.png",␊
+              "sizes": "192x192",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-256x256.png",␊
+              "sizes": "256x256",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-384x384.png",␊
+              "sizes": "384x384",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            },␊
+            {␊
+              "src": "android-chrome-512x512.png",␊
+              "sizes": "512x512",␊
+              "type": "image/png",␊
+              "purpose": "any"␊
+            }␊
+          ]␊
+        }`,
       },
       {
         assetName: 'assets/mstile-144x144.png',