Fixes #242 Breaking: if an output format is filtered it will not show…

… up as a key in the output! No more `svg: []`
11ty · Dec 20, 2024 · 186a3d4 · 186a3d4
1 parent 777be8c
commit 186a3d4
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 20 deletions.
diff --git a/src/image.js b/src/image.js
@@ -242,13 +242,8 @@ class Image {
     return [];
   }
 
-  _transformRawFiles(files = [], formats = []) {
+  _transformRawFiles(files = []) {
     let byType = {};
-    for(let format of formats) {
-      if(format && format !== 'auto') {
-        byType[format] = [];
-      }
-    }
     for(let file of files) {
       if(!byType[file.format]) {
         byType[file.format] = [];
@@ -442,18 +437,27 @@ class Image {
     return orientation >= 5 && orientation <= 8;
   }
 
-  isAnimated(metadata, options) {
-    // input has multiple pages: https://sharp.pixelplumbing.com/api-input#metadata
+  isAnimated(metadata) {
     // sharp options have animated image support enabled
-    return metadata?.pages > 1 && options?.sharpOptions?.animated;
+    if(!this.options?.sharpOptions?.animated) {
+      return false;
+    }
+
+    // input has multiple pages: https://sharp.pixelplumbing.com/api-input#metadata
+    return metadata?.pages > 1;
+  }
+
+  getEntryFormat(metadata) {
+    return metadata.format || this.options.overrideInputFormat;
   }
 
   // metadata so far: width, height, format
   // src is used to calculate the output file names
   getFullStats(metadata) {
     let results = [];
-    let isImageAnimated = this.isAnimated(metadata, this.options);
-    let outputFormats = Image.getFormatsArray(this.options.formats, metadata.format || this.options.overrideInputFormat, this.options.svgShortCircuit, isImageAnimated);
+    let isImageAnimated = this.isAnimated(metadata);
+    let entryFormat = this.getEntryFormat(metadata);
+    let outputFormats = Image.getFormatsArray(this.options.formats, entryFormat, this.options.svgShortCircuit, isImageAnimated);
 
     if (this.needsRotation(metadata.orientation)) {
       [metadata.height, metadata.width] = [metadata.width, metadata.height];
@@ -474,7 +478,7 @@ class Image {
       }
 
       if(outputFormat === "svg") {
-        if((metadata.format || this.options.overrideInputFormat) === "svg") {
+        if(entryFormat === "svg") {
           let svgStats = this.getStat("svg", metadata.width, metadata.height);
 
           // SVG metadata.size is only available with Buffer input (remote urls)
@@ -505,7 +509,7 @@ class Image {
       }
     }
 
-    return this._transformRawFiles(results, outputFormats);
+    return this._transformRawFiles(results);
   }
 
   getOutputSize(contents, filePath) {
@@ -669,7 +673,7 @@ class Image {
       }
     }
 
-    return Promise.all(outputFilePromises).then(files => this._transformRawFiles(files, Object.keys(fullStats)));
+    return Promise.all(outputFilePromises).then(files => this._transformRawFiles(files));
   }
 
   async getStatsOnly() {

diff --git a/test/test-markup.js b/test/test-markup.js
@@ -190,8 +190,8 @@ test("svgShortCircuit and generateHTML: Issue #48", async t => {
     dryRun: true,
   });
   t.is(stats.svg.length, 1);
-  t.is(stats.webp.length, 0);
-  t.is(stats.png.length, 0);
+  t.is(stats.webp, undefined);
+  t.is(stats.png, undefined);
   t.is(stats.svg[0].url, "/img/wGeeKEWkof-900.svg");
 
   let html = eleventyImage.generateHTML(stats, {
@@ -200,6 +200,21 @@ test("svgShortCircuit and generateHTML: Issue #48", async t => {
   t.is(html, `<img alt="Tiger" src="/img/wGeeKEWkof-900.svg" width="900" height="900">`);
 });
 
+test("svgShortCircuit (on a raster source) #242 generateHTML function", async t => {
+  let stats = await eleventyImage("./test/bio-2017.jpg", {
+    widths: ["auto"],
+    formats: ["svg", "png"],
+    svgShortCircuit: true,
+    useCache: false,
+    dryRun: true,
+  });
+
+  let html = eleventyImage.generateHTML(stats, {
+    alt: "Zach’s ugly mug",
+  });
+  t.is(html, `<img alt="Zach’s ugly mug" src="/img/KkPMmHd3hP-1280.png" width="1280" height="853">`);
+});
+
 test("Filter out empty format arrays", async t => {
   let stats = {
     svg: [],

diff --git a/test/test.js b/test/test.js
@@ -383,8 +383,7 @@ test("Ask for svg output from a raster image (skipped)", async t => {
     outputDir: "./test/img/"
   });
 
-  t.notDeepEqual(stats, {});
-  t.deepEqual(stats.svg, []);
+  t.deepEqual(stats, {});
 });
 
 test("Upscale an SVG, Issue #32", async t => {
@@ -422,10 +421,23 @@ test("svgShortCircuit", async t => {
     svgShortCircuit: true,
   });
 
+  t.deepEqual(Object.keys(stats), ["svg"]);
   t.is(stats.svg.length, 1);
   t.is(stats.svg[0].size, 1936);
-  t.is(stats.png.length, 0);
-  t.is(stats.webp.length, 0);
+});
+
+test("svgShortCircuit (on a raster source) #242", async t => {
+  let stats = await eleventyImage("./test/bio-2017.jpg", {
+    widths: ["auto"],
+    formats: ["svg", "png"],
+    svgShortCircuit: true,
+    useCache: false,
+    dryRun: true,
+  });
+
+  t.deepEqual(Object.keys(stats), ["png"]);
+  t.is(stats.png.length, 1);
+  t.is(stats.png[0].size, 2511518);
 });