From 788a3d12e1c0d73c1d21ba9cb4d47459e23561c7 Mon Sep 17 00:00:00 2001
From: fliptheweb <itisshortemailaddress@gmail.com>
Date: Fri, 4 Mar 2022 23:10:08 +0300
Subject: [PATCH 1/3] fix(next/image): normalize root path according to
 trailingSlash option in defaul loader

---
 packages/next/client/image.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/next/client/image.tsx b/packages/next/client/image.tsx
index 8322783f0b51..bd5281244327 100644
--- a/packages/next/client/image.tsx
+++ b/packages/next/client/image.tsx
@@ -9,6 +9,7 @@ import {
 import { useIntersection } from './use-intersection'
 import { ImageConfigContext } from '../shared/lib/image-config-context'
 import { warnOnce } from '../shared/lib/utils'
+import { normalizePathTrailingSlash } from './normalize-trailing-slash'
 
 const configEnv = process.env.__NEXT_IMAGE_OPTS as any as ImageConfigComplete
 const loadedImageURLs = new Set<string>()
@@ -877,7 +878,7 @@ function defaultLoader({
     return src
   }
 
-  return `${config.path}?url=${encodeURIComponent(src)}&w=${width}&q=${
+  return `${normalizePathTrailingSlash(config.path)}?url=${encodeURIComponent(src)}&w=${width}&q=${
     quality || 75
   }`
 }

From d23b27f6abadd492444bca2ed9de6adba282f144 Mon Sep 17 00:00:00 2001
From: fliptheweb <itisshortemailaddress@gmail.com>
Date: Mon, 7 Mar 2022 17:12:12 +0300
Subject: [PATCH 2/3] test(image-optimizer): trailingSlash support

---
 .../image-optimizer/test/index.test.js        | 26 +++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/test/integration/image-optimizer/test/index.test.js b/test/integration/image-optimizer/test/index.test.js
index 44ae3d8b8b2b..bcac0f864552 100644
--- a/test/integration/image-optimizer/test/index.test.js
+++ b/test/integration/image-optimizer/test/index.test.js
@@ -327,6 +327,32 @@ describe('Image Optimizer', () => {
     runTests(ctx)
   })
 
+  describe('Server support for trailingSlash in next.config.js', () => {
+    let app
+    let appPort
+    beforeAll(async () => {
+      nextConfig.replace(
+        '{ /* replaceme */ }',
+        JSON.stringify({
+          trailingSlash: true,
+        })
+      )
+      appPort = await findPort()
+      app = await launchApp(appDir, appPort)
+    })
+    afterAll(async () => {
+      await killApp(app)
+      nextConfig.restore()
+    })
+
+    it('should return successful response for original loader', async () => {
+      let res
+      const query = { url: '/test.png', w: 8, q: 70 }
+      res = await fetchViaHTTP(appPort, '/_next/image/', query)
+      expect(res.status).toBe(200)
+    })
+  })
+
   describe('Server support for headers in next.config.js', () => {
     const size = 96 // defaults defined in server/config.ts
     let app

From 76b9b39cf861f5644435055de4282e692676e6a7 Mon Sep 17 00:00:00 2001
From: fliptheweb <itisshortemailaddress@gmail.com>
Date: Mon, 7 Mar 2022 18:22:06 +0300
Subject: [PATCH 3/3] chore(next/image): prettier

---
 packages/next/client/image.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/next/client/image.tsx b/packages/next/client/image.tsx
index bd5281244327..d6ebf363b0f6 100644
--- a/packages/next/client/image.tsx
+++ b/packages/next/client/image.tsx
@@ -878,7 +878,7 @@ function defaultLoader({
     return src
   }
 
-  return `${normalizePathTrailingSlash(config.path)}?url=${encodeURIComponent(src)}&w=${width}&q=${
-    quality || 75
-  }`
+  return `${normalizePathTrailingSlash(config.path)}?url=${encodeURIComponent(
+    src
+  )}&w=${width}&q=${quality || 75}`
 }