fix(gatsby-transformer-sqip): Return null early for unsupported file …

…types (#16602)

* fix(gatsby-transformer-sqip): return null for unsupported file types

* test(gatsby-transformer-sqip): fix unsupported file types test

packages/gatsby-transformer-sqip/src/__tests__/generate-sqip.js

@@ -32,7 +32,7 @@ describe(`gatsby-transformer-sqip`, async () => {
   const absolutePath = resolve(
     __dirname,
     `images`,
-    `this-file-does-not-neet-to-exist-for-the-test.jpg`
+    `this-file-does-not-need-to-exist-for-the-test.jpg`
   )
   const cacheDir = __dirname
 
@@ -91,5 +91,31 @@ describe(`gatsby-transformer-sqip`, async () => {
       expect(writeFile).toHaveBeenCalledTimes(0)
       expect(readFile).toHaveBeenCalledTimes(1)
     })
+    it(`returns null for unsupported files`, async () => {
+      exists.mockImplementationOnce(() => true)
+
+      const cache = {
+        get: jest.fn(),
+        set: jest.fn(),
+      }
+      const numberOfPrimitives = 5
+      const blur = 0
+      const mode = 3
+      const result = await generateSqip({
+        cache,
+        cacheDir,
+        absolutePath: absolutePath.replace(`.jpg`, `.svg`),
+        numberOfPrimitives,
+        blur,
+        mode,
+      })
+
+      expect(result).toBe(null)
+
+      expect(sqip).toHaveBeenCalledTimes(0)
+      expect(exists).toHaveBeenCalledTimes(0)
+      expect(writeFile).toHaveBeenCalledTimes(0)
+      expect(readFile).toHaveBeenCalledTimes(0)
+    })
   })
 })

packages/gatsby-transformer-sqip/src/generate-sqip.js

@@ -23,7 +23,12 @@ module.exports = async function generateSqip(options) {
 
   debug({ options })
 
-  const { name } = parse(absolutePath)
+  const { name, ext } = parse(absolutePath)
+
+  if (!ext.match(/(jpe?g|png|gif)$/)) {
+    debug(`Unsupported file type ${name} (${contentDigest})`)
+    return null
+  }
 
   const sqipOptions = {
     numberOfPrimitives,