diff --git a/.gitignore b/.gitignore index 83c91d5f..7ea89793 100644 --- a/.gitignore +++ b/.gitignore @@ -112,6 +112,9 @@ Network Trash Folder Temporary Items .apdisk +### Brackets ### +.brackets.json + ### VisualStudioCode ### .vscode/* !.vscode/settings.json diff --git a/package-lock.json b/package-lock.json index aca1e07c..669d92da 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9016,6 +9016,7 @@ "jpeg-js": "^0.2.0", "load-bmfont": "^1.2.3", "mime": "^1.3.4", + "mkdirp": "0.5.1", "pixelmatch": "^4.0.0", "pngjs": "^3.0.0", "read-chunk": "^1.0.1", @@ -9049,6 +9050,19 @@ "version": "0.1.2", "resolved": "https://registry.npmjs.org/jpeg-js/-/jpeg-js-0.1.2.tgz", "integrity": "sha1-E1uZLAV1yYXPoPSUoyJ+0jhYPs4=" + }, + "minimist": { + "version": "0.0.8", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", + "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=" + }, + "mkdirp": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", + "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=", + "requires": { + "minimist": "0.0.8" + } } } }, diff --git a/readme.md b/readme.md index 133ed2aa..30bacffe 100644 --- a/readme.md +++ b/readme.md @@ -225,4 +225,6 @@ Because pure Javascript modules aren't available at the moment. For example, the Feel free to push your code if you agree with publishing under the MIT license. +When testing, don't forget to update snapshots whenever you edit them: `ava --update-snapshots`. + ## [License](LICENSE) diff --git a/src/config/html.js b/src/config/html.js index 26ba993c..82aa3e01 100644 --- a/src/config/html.js +++ b/src/config/html.js @@ -1,31 +1,20 @@ -// prettier-ignore -module.exports = { - android: [ - ({ relative, loadManifestWithCredentials }) => - loadManifestWithCredentials - ? `` - : ``, - () => ``, - ({ theme_color, background }) => ``, - ({ appName }) => appName ? `` : `` - ], - appleIcon: [ - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - () => ``, - ({ appleStatusBarStyle }) => ``, - ({ appShortName, appName }) => (appShortName || appName) ? `` : `` - ], - appleStartup: [ +/* eslint-disable */ + +const appleIconSizes = [ + 57, + 60, + 72, + 76, + 114, + 120, + 144, + 152, + 167, + 180, + 1024 +]; + +const appleStartupItems = [ // // Device Portrait size Landscape size Screen size Pixel ratio // iPhone SE 640px × 1136px 1136px × 640px 320px × 568px 2 @@ -45,46 +34,272 @@ module.exports = { // 10.5" iPad Pro 1668px × 2224px 2224px × 1668px 834px × 1112px 2 // 11" iPad Pro 1668px × 2388px 2388px × 1668px 834px × 1194px 2 // 12.9" iPad Pro 2048px × 2732px 2732px × 2048px 1024px × 1366px 2 + { + dwidth: 320, + dheight: 568, + pixelRatio: 2, + orientation: "portrait", + width: 640, + height: 1136, + }, + { + dwidth: 375, + dheight: 667, + pixelRatio: 2, + orientation: "portrait", + width: 750, + height: 1334, + }, + { + dwidth: 414, + dheight: 896, + pixelRatio: 2, + orientation: "portrait", + width: 828, + height: 1792, + }, + { + dwidth: 375, + dheight: 812, + pixelRatio: 3, + orientation: "portrait", + width: 1125, + height: 2436, + }, + { + dwidth: 414, + dheight: 736, + pixelRatio: 3, + orientation: "portrait", + width: 1242, + height: 2208, + }, + { + dwidth: 414, + dheight: 896, + pixelRatio: 3, + orientation: "portrait", + width: 1242, + height: 2688, + }, + { + dwidth: 768, + dheight: 1024, + pixelRatio: 2, + orientation: "portrait", + width: 1536, + height: 2048, + }, + { + dwidth: 834, + dheight: 1112, + pixelRatio: 2, + orientation: "portrait", + width: 1668, + height: 2224, + }, + { + dwidth: 834, + dheight: 1194, + pixelRatio: 2, + orientation: "portrait", + width: 1668, + height: 2388, + }, + { + dwidth: 1024, + dheight: 1366, + pixelRatio: 2, + orientation: "portrait", + width: 2048, + height: 2732, + }, + { + dwidth: 810, + dheight: 1080, + pixelRatio: 2, + orientation: "portrait", + width: 1620, + height: 2160, + }, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => `` - // + + { + dwidth: 320, + dheight: 568, + pixelRatio: 2, + orientation: "landscape", + width: 1136, + height: 640, + }, + { + dwidth: 375, + dheight: 667, + pixelRatio: 2, + orientation: "landscape", + width: 1334, + height: 750, + }, + { + dwidth: 414, + dheight: 896, + pixelRatio: 2, + orientation: "landscape", + width: 1792, + height: 828, + }, + { + dwidth: 375, + dheight: 812, + pixelRatio: 3, + orientation: "landscape", + width: 2436, + height: 1125, + }, + { + dwidth: 414, + dheight: 736, + pixelRatio: 3, + orientation: "landscape", + width: 2208, + height: 1242, + }, + { + dwidth: 414, + dheight: 896, + pixelRatio: 3, + orientation: "landscape", + width: 2688, + height: 1242, + }, + { + dwidth: 768, + dheight: 1024, + pixelRatio: 2, + orientation: "landscape", + width: 2048, + height: 1536, + }, + { + dwidth: 834, + dheight: 1112, + pixelRatio: 2, + orientation: "landscape", + width: 2224, + height: 1668, + }, + { + dwidth: 834, + dheight: 1194, + pixelRatio: 2, + orientation: "landscape", + width: 2388, + height: 1668, + }, + { + dwidth: 1024, + dheight: 1366, + pixelRatio: 2, + orientation: "landscape", + width: 2732, + height: 2048, + }, + { + dwidth: 810, + dheight: 1080, + pixelRatio: 2, + orientation: "landscape", + width: 2160, + height: 1620, + }, +]; + +const coastSizes = [ + 228, +]; + +const faviconSizes = [ + 16, + 32, + 48, +]; + +function hasAll(arr) { + return function (icons) { + if (Array.isArray(icons)) return arr.every(item => icons.includes(item)); + return icons; + }; +} + +function hasAny(arr){ + return function(icons){ + if(Array.isArray(icons)) + return arr.some(item => icons.include(item)); + + return icons; + } +} + +function ctxHasIcons(icons, icon) { + if (Array.isArray(icons)) return icons.includes(icon); + return icons; +} + +const allAppleIcons = hasAll(appleIconSizes.map(size => `apple-touch-icon-${size}x${size}.png`)); +const anyAppleIcon = hasAny(appleIconSizes.map(size => `apple-touch-icon-${size}x${size}.png`)); + +function appleIconGen(size, { relative, icons }) { + const iconName = `apple-touch-icon-${size}x${size}.png`; + + return !ctxHasIcons(icons.appleIcon, iconName) ? "" : ``; +} + +function appleStartupGen( + { width, height, dwidth, dheight, pixelRatio, orientation }, + { relative, icons } +) { + const iconName = `apple-touch-startup-image-${width}x${height}.png`; + + return !ctxHasIcons(icons.appleStartup, iconName) ? "" : ``; +} + +function coastGen(size, { relative, icons }) { + const iconName = `coast-${size}x${size}.png`; + + return !ctxHasIcons(icons.coast, iconName) ? "" : ``; +} + +function faviconGen(size, { relative, icons }){ + const iconName = `favicon-${size}x${size}.png`; + return !ctxHasIcons(icons.favicons, iconName) ? "" : ``; +} + +// prettier-ignore +module.exports = { + android: [ + ({ relative, loadManifestWithCredentials }) => + loadManifestWithCredentials + ? `` + : ``, + () => ``, + ({ theme_color, background }) => ``, + ({ appName }) => appName ? `` : `` ], - coast: [ - ({ relative }) => `` + appleIcon: [ + ...appleIconSizes.map(size => ctx => appleIconGen(size, ctx)), + () => ``, + ({ appleStatusBarStyle }) => ``, + ({ appShortName, appName }) => (appShortName || appName) ? `` : `` ], + appleStartup: appleStartupItems.map(item => ctx => appleStartupGen(item, ctx)), + coast: coastSizes.map(size => ctx => coastGen(size, ctx)), favicons: [ - ({ relative }) => ``, - ({ relative }) => ``, - ({ relative }) => ``, - // 48x48 - ({ relative }) => ``, - // + ({ relative, icons }) => !ctxHasIcons(icons.favicons, "favicon.ico") ? "" : ``, + ...faviconSizes.map(size => ctx => faviconGen(size, ctx)), ], windows: [ ({ background }) => ``, - ({ relative }) => ``, + ({ relative, icons }) => !ctxHasIcons(icons.windows, "mstile-144x144.png") ? "" : ``, ({ relative }) => `` ], yandex: [ diff --git a/src/helpers.js b/src/helpers.js index bbb524df..8cea4a5c 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -177,7 +177,7 @@ module.exports = function(options) { properties.start_url = options.start_url; properties.background_color = options.background; properties.theme_color = options.theme_color; - properties.icons.map( + properties.icons.forEach( icon => (icon.src = relative(icon.src, options.manifestRelativePaths)) ); diff --git a/test/restrict.test.js b/test/restrict.test.js index 6d071954..2a0d8982 100644 --- a/test/restrict.test.js +++ b/test/restrict.test.js @@ -9,22 +9,149 @@ const { logo_png } = require("./util"); // snapshotManager.plugins.push(factory(Image, v => new Image(v[0], v[1]))); +const source = logo_png; + +const options = { + icons: { + favicons: ["favicon-32x32.png"], + android: false, + appleIcon: false, + appleStartup: false, + coast: false, + firefox: false, + windows: false, + yandex: false + } +}; + +const metaLength = 0; + +const expectedLength = + Object.values(options.icons).reduce( + (acc, elem) => acc + (Array.isArray(elem) ? elem.length : 0), + 0 + ) + metaLength; + +function processSource() { + return favicons(source, options); +} + +function generatedHTML(html) { + return html.filter(str => str.length > 0); +} + test("should allow to restrict the icons to generate", async t => { + // eslint-disable-next-line no-magic-numbers + const testCases = [ + { + // favicons + source, + options + }, + { + // android + source, + options: { + ...options, + icons: { + ...options.icons, + favicons: false, + android: ["android-chrome-48x48.png"] + } + } + }, + { + // appleIcon + source, + options: { + ...options, + icons: { + ...options.icons, + favicons: false, + appleIcon: ["apple-touch-icon-60x60.png"] + } + } + } + ]; + + t.plan(testCases.length); + + const promises = testCases.map(async ({ source, options }) => { + const { images } = await favicons(source, options); + + t.deepEqual(images.length, expectedLength); + }); + + await Promise.all(promises); +}); + +test("should allow to restrict the HTML tags generated", async t => { // eslint-disable-next-line no-magic-numbers t.plan(1); - const { images } = await favicons(logo_png, { - icons: { - favicons: ["favicon-32x32.png"], - android: false, - appleIcon: false, - appleStartup: false, - coast: false, - firefox: false, - windows: false, - yandex: false + const { html } = await processSource(); + + const useful = generatedHTML(html); + + t.deepEqual(useful.length, expectedLength); +}); + +test("should allow to restrict the HTML tags taking into account manifests and others", async t => { + const testCases = [ + { + // android + testOptions: { + favicons: false, + android: ["android-chrome-48x48.png"], + appleIcon: false, + appleStartup: false, + coast: false, + firefox: false, + windows: false, + yandex: false + }, + expectedLength: 4 // (manifest + capable + theme color + app name) + }, + { + // firefox + testOptions: { + favicons: false, + android: false, + appleIcon: false, + appleStartup: false, + coast: false, + firefox: ["firefox_app_128x128.png"], + windows: false, + yandex: false + }, + expectedLength: 0 // nothing + }, + { + // appleIcon + testOptions: { + favicons: false, + android: false, + appleIcon: ["apple-touch-icon-60x60.png"], + appleStartup: false, + coast: false, + firefox: false, + windows: false, + yandex: false + }, + expectedLength: 4 // icons + (capable + status bar + app name) } + ]; + + t.plan(testCases.length); + + const promises = testCases.map(async ({ testOptions, expectedLength }) => { + const { html } = await favicons(source, { + icons: testOptions + }); + const useful = generatedHTML(html); + + t.deepEqual(useful.length, expectedLength); }); - t.deepEqual(images.length, 1); + await Promise.all(promises); }); diff --git a/test/snapshots/array.test.js.md b/test/snapshots/array.test.js.md index 3025ee19..c0df42ad 100644 --- a/test/snapshots/array.test.js.md +++ b/test/snapshots/array.test.js.md @@ -144,28 +144,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/array.test.js.snap b/test/snapshots/array.test.js.snap index 1403c8fa..12294176 100644 Binary files a/test/snapshots/array.test.js.snap and b/test/snapshots/array.test.js.snap differ diff --git a/test/snapshots/background.test.js.md b/test/snapshots/background.test.js.md index 1c1dd01b..17dd74db 100644 --- a/test/snapshots/background.test.js.md +++ b/test/snapshots/background.test.js.md @@ -144,28 +144,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/background.test.js.snap b/test/snapshots/background.test.js.snap index 469eaf3a..ea947c36 100644 Binary files a/test/snapshots/background.test.js.snap and b/test/snapshots/background.test.js.snap differ diff --git a/test/snapshots/default.test.js.md b/test/snapshots/default.test.js.md index 85d552e4..dcd20431 100644 --- a/test/snapshots/default.test.js.md +++ b/test/snapshots/default.test.js.md @@ -144,28 +144,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/default.test.js.snap b/test/snapshots/default.test.js.snap index 7a24a0e5..15030565 100644 Binary files a/test/snapshots/default.test.js.snap and b/test/snapshots/default.test.js.snap differ diff --git a/test/snapshots/meta.test.js.md b/test/snapshots/meta.test.js.md index ebf43314..37c9f5c0 100644 --- a/test/snapshots/meta.test.js.md +++ b/test/snapshots/meta.test.js.md @@ -145,28 +145,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/meta.test.js.snap b/test/snapshots/meta.test.js.snap index d9054565..066bbc83 100644 Binary files a/test/snapshots/meta.test.js.snap and b/test/snapshots/meta.test.js.snap differ diff --git a/test/snapshots/offset.test.js.md b/test/snapshots/offset.test.js.md index a8f4f314..64e6986d 100644 --- a/test/snapshots/offset.test.js.md +++ b/test/snapshots/offset.test.js.md @@ -144,28 +144,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/offset.test.js.snap b/test/snapshots/offset.test.js.snap index eadb6838..4eba8a19 100644 Binary files a/test/snapshots/offset.test.js.snap and b/test/snapshots/offset.test.js.snap differ diff --git a/test/snapshots/pixelart.test.js.md b/test/snapshots/pixelart.test.js.md index edfc610e..1f54733b 100644 --- a/test/snapshots/pixelart.test.js.md +++ b/test/snapshots/pixelart.test.js.md @@ -144,28 +144,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/pixelart.test.js.snap b/test/snapshots/pixelart.test.js.snap index 2fdd2e4b..312e4c61 100644 Binary files a/test/snapshots/pixelart.test.js.snap and b/test/snapshots/pixelart.test.js.snap differ diff --git a/test/snapshots/prefixed.test.js.md b/test/snapshots/prefixed.test.js.md index d224d2cf..67c78d62 100644 --- a/test/snapshots/prefixed.test.js.md +++ b/test/snapshots/prefixed.test.js.md @@ -144,28 +144,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/prefixed.test.js.snap b/test/snapshots/prefixed.test.js.snap index c135afe5..e0a47928 100644 Binary files a/test/snapshots/prefixed.test.js.snap and b/test/snapshots/prefixed.test.js.snap differ diff --git a/test/snapshots/stream.test.js.md b/test/snapshots/stream.test.js.md index 056c3b15..983fbf62 100644 --- a/test/snapshots/stream.test.js.md +++ b/test/snapshots/stream.test.js.md @@ -282,28 +282,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/stream.test.js.snap b/test/snapshots/stream.test.js.snap index 953107b5..a0642fb4 100644 Binary files a/test/snapshots/stream.test.js.snap and b/test/snapshots/stream.test.js.snap differ diff --git a/test/snapshots/svg.test.js.md b/test/snapshots/svg.test.js.md index fb23c7c1..32288ad0 100644 --- a/test/snapshots/svg.test.js.md +++ b/test/snapshots/svg.test.js.md @@ -144,28 +144,28 @@ Generated by [AVA](https://avajs.dev). '', '', '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', - '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '', + '', '', '', '', diff --git a/test/snapshots/svg.test.js.snap b/test/snapshots/svg.test.js.snap index 62a3a3aa..02e6ce4e 100644 Binary files a/test/snapshots/svg.test.js.snap and b/test/snapshots/svg.test.js.snap differ