feat(next/image): add support for images.qualities in next.config

[styfle]

Work in progress...

• Depends on [cli][build-utils][next] add support for images.qualities vercel#12792

[ijjk]

Failing test suites

Commit: 3da81cc

pnpm test test/integration/image-optimizer/test/dangerously-allow-svg.test.ts (turbopack)

• with dangerouslyAllowSVG config > dev support with next.config.js > should normalize invalid status codes
• with dangerouslyAllowSVG config > dev support with next.config.js > should timeout for upstream image exceeding 7 seconds
• with dangerouslyAllowSVG config > dev support with next.config.js > should handle non-ascii characters in image url
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain icns
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain pic/pct
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain animated gif
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain animated png
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain animated png 2
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain animated webp
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain vector svg
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain ico format
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain jpg format for old Safari
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain png format for old Safari
• with dangerouslyAllowSVG config > dev support with next.config.js > should downlevel webp format to jpeg for old Safari
• with dangerouslyAllowSVG config > dev support with next.config.js > should downlevel avif format to jpeg for old Safari
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize relative url and webp Firefox accept header
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize relative url and png accept header
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize relative url with invalid accept header as png
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize relative url with invalid accept header as gif
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize relative url with invalid accept header as tiff
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize gif (not animated)
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize tiff
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize avif
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize relative url and old Chrome accept header as webp
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize relative url and new Chrome accept header as avif
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize avif and maintain format
• with dangerouslyAllowSVG config > dev support with next.config.js > should compress avif smaller than webp at q=100
• with dangerouslyAllowSVG config > dev support with next.config.js > should compress avif smaller than webp at q=75
• with dangerouslyAllowSVG config > dev support with next.config.js > should compress avif smaller than webp at q=50
• with dangerouslyAllowSVG config > dev support with next.config.js > should resize absolute url from localhost
• with dangerouslyAllowSVG config > dev support with next.config.js > should automatically detect image type when content-type is octet-stream
• with dangerouslyAllowSVG config > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for external image
• with dangerouslyAllowSVG config > dev support with next.config.js > should fail when internal url is not an image
• with dangerouslyAllowSVG config > dev support with next.config.js > should fail when url fails to load an image
• with dangerouslyAllowSVG config > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for internal image
• with dangerouslyAllowSVG config > dev support with next.config.js > should use cached image file when parameters are the same for svg
• with dangerouslyAllowSVG config > dev support with next.config.js > should use cached image file when parameters are the same for animated gif
• with dangerouslyAllowSVG config > dev support with next.config.js > should set 304 status without body when etag matches if-none-match
• with dangerouslyAllowSVG config > dev support with next.config.js > should maintain bmp
• with dangerouslyAllowSVG config > dev support with next.config.js > should not resize if requested width is larger than original source image
• with dangerouslyAllowSVG config > dev support with next.config.js > should error if the resource isn't a valid image
• with dangerouslyAllowSVG config > dev support with next.config.js > should error if the image file does not exist
• with dangerouslyAllowSVG config > dev support with next.config.js > should handle concurrent requests
• with dangerouslyAllowSVG config > dev support with next.config.js > recursive url is not allowed > should pass with absolute next image url

Expand output

● with dangerouslyAllowSVG config › dev support with next.config.js › should normalize invalid status codes

expect(received).toBe(expected) // Object.is equality

Expected: 500
Received: 400

  177 |
  178 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 179 |       expect(res.status).toBe(500)
      |                          ^
  180 |     })
  181 |
  182 |     it('should timeout for upstream image exceeding 7 seconds', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:179:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should timeout for upstream image exceeding 7 seconds

expect(received).toBe(expected) // Object.is equality

Expected: 504
Received: 400

  184 |       const query = { url, w: ctx.w, q: 100 }
  185 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 186 |       expect(res.status).toBe(504)
      |                          ^
  187 |     })
  188 |   }
  189 |

  at Object.toBe (integration/image-optimizer/test/util.ts:186:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should handle non-ascii characters in image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  196 |     const query = { w: ctx.w, q: 90, url: '/äöüščří.png' }
  197 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 198 |     expect(res.status).toBe(200)
      |                        ^
  199 |   })
  200 |
  201 |   it('should maintain icns', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:198:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain icns

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  202 |     const query = { w: ctx.w, q: 90, url: '/test.icns' }
  203 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 204 |     expect(res.status).toBe(200)
      |                        ^
  205 |     expect(res.headers.get('Content-Type')).toContain('image/x-icns')
  206 |     expect(res.headers.get('Cache-Control')).toBe(
  207 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:204:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain pic/pct

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  218 |     const query = { w: ctx.w, q: 90, url: '/test.pic' }
  219 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 220 |     expect(res.status).toBe(200)
      |                        ^
  221 |     expect(res.headers.get('Content-Type')).toContain('image/x-pict')
  222 |     expect(res.headers.get('Cache-Control')).toBe(
  223 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:220:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  239 |     const query = { w: ctx.w, q: 90, url: '/animated.gif' }
  240 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 241 |     expect(res.status).toBe(200)
      |                        ^
  242 |     expect(res.headers.get('content-type')).toContain('image/gif')
  243 |     expect(res.headers.get('Cache-Control')).toBe(
  244 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:241:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain animated png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  256 |     const query = { w: ctx.w, q: 90, url: '/animated.png' }
  257 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 258 |     expect(res.status).toBe(200)
      |                        ^
  259 |     expect(res.headers.get('content-type')).toContain('image/png')
  260 |     expect(res.headers.get('Cache-Control')).toBe(
  261 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:258:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain animated png 2

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  273 |     const query = { w: ctx.w, q: 90, url: '/animated2.png' }
  274 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 275 |     expect(res.status).toBe(200)
      |                        ^
  276 |     expect(res.headers.get('content-type')).toContain('image/png')
  277 |     expect(res.headers.get('Cache-Control')).toBe(
  278 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:275:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain animated webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  290 |     const query = { w: ctx.w, q: 90, url: '/animated.webp' }
  291 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 292 |     expect(res.status).toBe(200)
      |                        ^
  293 |     expect(res.headers.get('content-type')).toContain('image/webp')
  294 |     expect(res.headers.get('Cache-Control')).toBe(
  295 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:292:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain vector svg

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  309 |       const opts = { headers: { accept: 'image/webp' } }
  310 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 311 |       expect(res.status).toBe(200)
      |                          ^
  312 |       expect(res.headers.get('Content-Length')).toBe('603')
  313 |       expect(res.headers.get('Content-Type')).toContain('image/svg+xml')
  314 |       expect(res.headers.get('Cache-Control')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:311:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain ico format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  389 |     const opts = { headers: { accept: 'image/webp' } }
  390 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 391 |     expect(res.status).toBe(200)
      |                        ^
  392 |     expect(res.headers.get('Content-Type')).toContain('image/x-icon')
  393 |     expect(res.headers.get('Cache-Control')).toBe(
  394 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:391:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain jpg format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  413 |     const opts = { headers: { accept } }
  414 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 415 |     expect(res.status).toBe(200)
      |                        ^
  416 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  417 |     expect(res.headers.get('Cache-Control')).toBe(
  418 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:415:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain png format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  431 |     const opts = { headers: { accept } }
  432 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 433 |     expect(res.status).toBe(200)
      |                        ^
  434 |     expect(res.headers.get('Content-Type')).toContain('image/png')
  435 |     expect(res.headers.get('Cache-Control')).toBe(
  436 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:433:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should downlevel webp format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  449 |     const opts = { headers: { accept } }
  450 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 451 |     expect(res.status).toBe(200)
      |                        ^
  452 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  453 |     expect(res.headers.get('Cache-Control')).toBe(
  454 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:451:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should downlevel avif format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  468 |     const opts = { headers: { accept } }
  469 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 470 |     expect(res.status).toBe(200)
      |                        ^
  471 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  472 |     expect(res.headers.get('Cache-Control')).toBe(
  473 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:470:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize relative url and webp Firefox accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  629 |     const opts = { headers: { accept: 'image/webp,*/*' } }
  630 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 631 |     expect(res.status).toBe(200)
      |                        ^
  632 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  633 |     expect(res.headers.get('Cache-Control')).toBe(
  634 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:631:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize relative url and png accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  646 |     const opts = { headers: { accept: 'image/png' } }
  647 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 648 |     expect(res.status).toBe(200)
      |                        ^
  649 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  650 |     expect(res.headers.get('Cache-Control')).toBe(
  651 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:648:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize relative url with invalid accept header as png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  663 |     const opts = { headers: { accept: 'image/invalid' } }
  664 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 665 |     expect(res.status).toBe(200)
      |                        ^
  666 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  667 |     expect(res.headers.get('Cache-Control')).toBe(
  668 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:665:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize relative url with invalid accept header as gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  680 |     const opts = { headers: { accept: 'image/invalid' } }
  681 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 682 |     expect(res.status).toBe(200)
      |                        ^
  683 |     expect(res.headers.get('Content-Type')).toBe('image/gif')
  684 |     expect(res.headers.get('Cache-Control')).toBe(
  685 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:682:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize relative url with invalid accept header as tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  697 |     const opts = { headers: { accept: 'image/invalid' } }
  698 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 699 |     expect(res.status).toBe(200)
      |                        ^
  700 |     expect(res.headers.get('Content-Type')).toBe('image/tiff')
  701 |     expect(res.headers.get('Cache-Control')).toBe(
  702 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:699:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize gif (not animated)

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  714 |     const opts = { headers: { accept: 'image/webp' } }
  715 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 716 |     expect(res.status).toBe(200)
      |                        ^
  717 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  718 |     expect(res.headers.get('Cache-Control')).toBe(
  719 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:716:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  731 |     const opts = { headers: { accept: 'image/webp' } }
  732 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 733 |     expect(res.status).toBe(200)
      |                        ^
  734 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  735 |     expect(res.headers.get('Cache-Control')).toBe(
  736 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:733:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  748 |     const opts = { headers: { accept: 'image/webp' } }
  749 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 750 |     expect(res.status).toBe(200)
      |                        ^
  751 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  752 |     expect(res.headers.get('Cache-Control')).toBe(
  753 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:750:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize relative url and old Chrome accept header as webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  767 |     }
  768 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 769 |     expect(res.status).toBe(200)
      |                        ^
  770 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  771 |     expect(res.headers.get('Cache-Control')).toBe(
  772 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:769:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize relative url and new Chrome accept header as avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  789 |       }
  790 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 791 |       expect(res.status).toBe(200)
      |                          ^
  792 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  793 |       expect(res.headers.get('Cache-Control')).toBe(
  794 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:791:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize avif and maintain format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  806 |       const opts = { headers: { accept: 'image/avif' } }
  807 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 808 |       expect(res.status).toBe(200)
      |                          ^
  809 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  810 |       expect(res.headers.get('Cache-Control')).toBe(
  811 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:808:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should compress avif smaller than webp at q=100

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:822:7)

● with dangerouslyAllowSVG config › dev support with next.config.js › should compress avif smaller than webp at q=75

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:826:7)

● with dangerouslyAllowSVG config › dev support with next.config.js › should compress avif smaller than webp at q=50

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:830:7)

● with dangerouslyAllowSVG config › dev support with next.config.js › should resize absolute url from localhost

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  838 |       const opts = { headers: { accept: 'image/webp' } }
  839 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 840 |       expect(res.status).toBe(200)
      |                          ^
  841 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  842 |       expect(res.headers.get('Cache-Control')).toBe(
  843 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:840:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should automatically detect image type when content-type is octet-stream

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  861 |       const opts = { headers: { accept: 'image/webp' } }
  862 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 863 |       expect(res.status).toBe(200)
      |                          ^
  864 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  865 |       expect(res.headers.get('Cache-Control')).toBe(
  866 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:863:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for external image

expect(received).toBeGreaterThan(expected)

Expected: > 500
Received:   1

  894 |         opts
  895 |       )
> 896 |       expect(one.duration).toBeGreaterThan(delay)
      |                            ^
  897 |       expect(one.res.status).toBe(200)
  898 |       expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  899 |       expect(one.res.headers.get('Content-Type')).toBe('image/webp')

  at Object.toBeGreaterThan (integration/image-optimizer/test/util.ts:896:28)

● with dangerouslyAllowSVG config › dev support with next.config.js › recursive url is not allowed › should pass with absolute next image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1047 |         const query = { url: fullUrl, w: ctx.w, q: 1 }
  1048 |         const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1049 |         expect(res.status).toBe(200)
       |                            ^
  1050 |         await expectWidth(res, ctx.w)
  1051 |       })
  1052 |     } else {

  at Object.toBe (integration/image-optimizer/test/util.ts:1049:28)

● with dangerouslyAllowSVG config › dev support with next.config.js › should fail when internal url is not an image

expect(received).toBe(expected) // Object.is equality

Expected: "Unable to optimize image and unable to fallback to upstream image"
Received: "\"q\" parameter (quality) of 39 is not allowed"

  1076 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1077 |     expect(res.status).toBe(400)
> 1078 |     expect(await res.text()).toBe(
       |                              ^
  1079 |       `Unable to optimize image and unable to fallback to upstream image`
  1080 |     )
  1081 |   })

  at Object.toBe (integration/image-optimizer/test/util.ts:1078:30)

● with dangerouslyAllowSVG config › dev support with next.config.js › should fail when url fails to load an image

expect(received).toBe(expected) // Object.is equality

Expected: 404
Received: 400

  1086 |       const query = { w: ctx.w, url, q: 100 }
  1087 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1088 |       expect(res.status).toBe(404)
       |                          ^
  1089 |       expect(await res.text()).toBe(
  1090 |         `"url" parameter is valid but upstream response is invalid`
  1091 |       )

  at Object.toBe (integration/image-optimizer/test/util.ts:1088:26)

● with dangerouslyAllowSVG config › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for internal image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1115 |       opts
  1116 |     )
> 1117 |     expect(one.res.status).toBe(200)
       |                            ^
  1118 |     expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1119 |     expect(one.res.headers.get('Content-Type')).toBe('image/webp')
  1120 |     expect(one.res.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1117:28)

● with dangerouslyAllowSVG config › dev support with next.config.js › should use cached image file when parameters are the same for svg

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1213 |
  1214 |       const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1215 |       expect(res1.status).toBe(200)
       |                           ^
  1216 |       expect(res1.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1217 |       expect(res1.headers.get('Content-Type')).toBe('image/svg+xml')
  1218 |       expect(res1.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1215:27)

● with dangerouslyAllowSVG config › dev support with next.config.js › should use cached image file when parameters are the same for animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1250 |
  1251 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1252 |     expect(res1.status).toBe(200)
       |                         ^
  1253 |     expect(res1.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1254 |     expect(res1.headers.get('Content-Type')).toBe('image/gif')
  1255 |     expect(res1.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1252:25)

● with dangerouslyAllowSVG config › dev support with next.config.js › should set 304 status without body when etag matches if-none-match

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1279 |
  1280 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts1)
> 1281 |     expect(res1.status).toBe(200)
       |                         ^
  1282 |     expect(res1.headers.get('Content-Type')).toBe('image/webp')
  1283 |     expect(res1.headers.get('Cache-Control')).toBe(
  1284 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1281:25)

● with dangerouslyAllowSVG config › dev support with next.config.js › should maintain bmp

ENOENT: no such file or directory, scandir '/root/actions-runner/_work/next.js/next.js/test/integration/image-optimizer/app/.next/cache/images'

● with dangerouslyAllowSVG config › dev support with next.config.js › should not resize if requested width is larger than original source image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1354 |     const opts = { headers: { accept: 'image/webp' } }
  1355 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1356 |     expect(res.status).toBe(200)
       |                        ^
  1357 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  1358 |     expect(res.headers.get('Cache-Control')).toBe(
  1359 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1356:24)

● with dangerouslyAllowSVG config › dev support with next.config.js › should error if the resource isn't a valid image

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1407 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1408 |     expect(res.status).toBe(400)
> 1409 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1410 |   })
  1411 |
  1412 |   it('should error if the image file does not exist', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:1409:30)

● with dangerouslyAllowSVG config › dev support with next.config.js › should error if the image file does not exist

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1415 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1416 |     expect(res.status).toBe(400)
> 1417 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1418 |   })
  1419 |
  1420 |   if (domains.length > 0) {

  at Object.toBe (integration/image-optimizer/test/util.ts:1417:30)

● with dangerouslyAllowSVG config › dev support with next.config.js › should handle concurrent requests

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1438 |       }
  1439 |
> 1440 |       expect(res1.status).toBe(200)
       |                           ^
  1441 |       expect(res2.status).toBe(200)
  1442 |       expect(res3.status).toBe(200)
  1443 |

  at Object.toBe (integration/image-optimizer/test/util.ts:1440:27)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/image-optimizer/test/minimum-cache-ttl.test.ts (turbopack)

• with minimumCacheTTL of 5 sec > dev support with next.config.js > should normalize invalid status codes
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should timeout for upstream image exceeding 7 seconds
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should handle non-ascii characters in image url
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain icns
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain pic/pct
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain animated gif
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain animated png
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain animated png 2
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain animated webp
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should not allow vector svg
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should not allow svg with application header
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should not allow svg with comma header
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should not allow svg with uppercase header
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should not allow svg with wrong header
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain ico format
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain jpg format for old Safari
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain png format for old Safari
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should downlevel webp format to jpeg for old Safari
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should downlevel avif format to jpeg for old Safari
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize relative url and webp Firefox accept header
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize relative url and png accept header
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize relative url with invalid accept header as png
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize relative url with invalid accept header as gif
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize relative url with invalid accept header as tiff
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize gif (not animated)
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize tiff
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize avif
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize relative url and old Chrome accept header as webp
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize relative url and new Chrome accept header as avif
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize avif and maintain format
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should compress avif smaller than webp at q=100
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should compress avif smaller than webp at q=75
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should compress avif smaller than webp at q=50
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should resize absolute url from localhost
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should automatically detect image type when content-type is octet-stream
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for external image
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should fail when internal url is not an image
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should fail when url fails to load an image
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for internal image
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should use cached image file when parameters are the same for animated gif
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should set 304 status without body when etag matches if-none-match
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should maintain bmp
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should not resize if requested width is larger than original source image
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should error if the resource isn't a valid image
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should error if the image file does not exist
• with minimumCacheTTL of 5 sec > dev support with next.config.js > should handle concurrent requests
• with minimumCacheTTL of 5 sec > dev support with next.config.js > recursive url is not allowed > should pass with absolute next image url

Expand output

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should normalize invalid status codes

expect(received).toBe(expected) // Object.is equality

Expected: 500
Received: 400

  177 |
  178 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 179 |       expect(res.status).toBe(500)
      |                          ^
  180 |     })
  181 |
  182 |     it('should timeout for upstream image exceeding 7 seconds', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:179:26)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should timeout for upstream image exceeding 7 seconds

expect(received).toBe(expected) // Object.is equality

Expected: 504
Received: 400

  184 |       const query = { url, w: ctx.w, q: 100 }
  185 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 186 |       expect(res.status).toBe(504)
      |                          ^
  187 |     })
  188 |   }
  189 |

  at Object.toBe (integration/image-optimizer/test/util.ts:186:26)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should handle non-ascii characters in image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  196 |     const query = { w: ctx.w, q: 90, url: '/äöüščří.png' }
  197 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 198 |     expect(res.status).toBe(200)
      |                        ^
  199 |   })
  200 |
  201 |   it('should maintain icns', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:198:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain icns

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  202 |     const query = { w: ctx.w, q: 90, url: '/test.icns' }
  203 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 204 |     expect(res.status).toBe(200)
      |                        ^
  205 |     expect(res.headers.get('Content-Type')).toContain('image/x-icns')
  206 |     expect(res.headers.get('Cache-Control')).toBe(
  207 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:204:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain pic/pct

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  218 |     const query = { w: ctx.w, q: 90, url: '/test.pic' }
  219 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 220 |     expect(res.status).toBe(200)
      |                        ^
  221 |     expect(res.headers.get('Content-Type')).toContain('image/x-pict')
  222 |     expect(res.headers.get('Cache-Control')).toBe(
  223 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:220:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  239 |     const query = { w: ctx.w, q: 90, url: '/animated.gif' }
  240 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 241 |     expect(res.status).toBe(200)
      |                        ^
  242 |     expect(res.headers.get('content-type')).toContain('image/gif')
  243 |     expect(res.headers.get('Cache-Control')).toBe(
  244 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:241:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain animated png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  256 |     const query = { w: ctx.w, q: 90, url: '/animated.png' }
  257 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 258 |     expect(res.status).toBe(200)
      |                        ^
  259 |     expect(res.headers.get('content-type')).toContain('image/png')
  260 |     expect(res.headers.get('Cache-Control')).toBe(
  261 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:258:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain animated png 2

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  273 |     const query = { w: ctx.w, q: 90, url: '/animated2.png' }
  274 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 275 |     expect(res.status).toBe(200)
      |                        ^
  276 |     expect(res.headers.get('content-type')).toContain('image/png')
  277 |     expect(res.headers.get('Cache-Control')).toBe(
  278 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:275:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain animated webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  290 |     const query = { w: ctx.w, q: 90, url: '/animated.webp' }
  291 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 292 |     expect(res.status).toBe(200)
      |                        ^
  293 |     expect(res.headers.get('content-type')).toContain('image/webp')
  294 |     expect(res.headers.get('Cache-Control')).toBe(
  295 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:292:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should not allow vector svg

expect(received).toContain(expected) // indexOf

Expected substring: "valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 35 is not allowed"

  341 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  342 |       expect(res.status).toBe(400)
> 343 |       expect(await res.text()).toContain('valid but image type is not allowed')
      |                                ^
  344 |     })
  345 |
  346 |     it('should not allow svg with application header', async () => {

  at Object.toContain (integration/image-optimizer/test/util.ts:343:32)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should not allow svg with application header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 45 is not allowed"

  349 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  350 |       expect(res.status).toBe(400)
> 351 |       expect(await res.text()).toContain(
      |                                ^
  352 |         "The requested resource isn't a valid image"
  353 |       )
  354 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:351:32)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should not allow svg with comma header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 55 is not allowed"

  359 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  360 |       expect(res.status).toBe(400)
> 361 |       expect(await res.text()).toContain(
      |                                ^
  362 |         "The requested resource isn't a valid image"
  363 |       )
  364 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:361:32)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should not allow svg with uppercase header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  369 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  370 |       expect(res.status).toBe(400)
> 371 |       expect(await res.text()).toContain(
      |                                ^
  372 |         '"url" parameter is valid but image type is not allowed'
  373 |       )
  374 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:371:32)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should not allow svg with wrong header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  379 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  380 |       expect(res.status).toBe(400)
> 381 |       expect(await res.text()).toContain(
      |                                ^
  382 |         '"url" parameter is valid but image type is not allowed'
  383 |       )
  384 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:381:32)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain ico format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  389 |     const opts = { headers: { accept: 'image/webp' } }
  390 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 391 |     expect(res.status).toBe(200)
      |                        ^
  392 |     expect(res.headers.get('Content-Type')).toContain('image/x-icon')
  393 |     expect(res.headers.get('Cache-Control')).toBe(
  394 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:391:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain jpg format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  413 |     const opts = { headers: { accept } }
  414 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 415 |     expect(res.status).toBe(200)
      |                        ^
  416 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  417 |     expect(res.headers.get('Cache-Control')).toBe(
  418 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:415:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain png format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  431 |     const opts = { headers: { accept } }
  432 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 433 |     expect(res.status).toBe(200)
      |                        ^
  434 |     expect(res.headers.get('Content-Type')).toContain('image/png')
  435 |     expect(res.headers.get('Cache-Control')).toBe(
  436 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:433:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should downlevel webp format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  449 |     const opts = { headers: { accept } }
  450 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 451 |     expect(res.status).toBe(200)
      |                        ^
  452 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  453 |     expect(res.headers.get('Cache-Control')).toBe(
  454 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:451:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should downlevel avif format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  468 |     const opts = { headers: { accept } }
  469 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 470 |     expect(res.status).toBe(200)
      |                        ^
  471 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  472 |     expect(res.headers.get('Cache-Control')).toBe(
  473 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:470:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize relative url and webp Firefox accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  629 |     const opts = { headers: { accept: 'image/webp,*/*' } }
  630 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 631 |     expect(res.status).toBe(200)
      |                        ^
  632 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  633 |     expect(res.headers.get('Cache-Control')).toBe(
  634 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:631:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize relative url and png accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  646 |     const opts = { headers: { accept: 'image/png' } }
  647 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 648 |     expect(res.status).toBe(200)
      |                        ^
  649 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  650 |     expect(res.headers.get('Cache-Control')).toBe(
  651 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:648:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize relative url with invalid accept header as png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  663 |     const opts = { headers: { accept: 'image/invalid' } }
  664 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 665 |     expect(res.status).toBe(200)
      |                        ^
  666 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  667 |     expect(res.headers.get('Cache-Control')).toBe(
  668 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:665:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize relative url with invalid accept header as gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  680 |     const opts = { headers: { accept: 'image/invalid' } }
  681 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 682 |     expect(res.status).toBe(200)
      |                        ^
  683 |     expect(res.headers.get('Content-Type')).toBe('image/gif')
  684 |     expect(res.headers.get('Cache-Control')).toBe(
  685 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:682:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize relative url with invalid accept header as tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  697 |     const opts = { headers: { accept: 'image/invalid' } }
  698 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 699 |     expect(res.status).toBe(200)
      |                        ^
  700 |     expect(res.headers.get('Content-Type')).toBe('image/tiff')
  701 |     expect(res.headers.get('Cache-Control')).toBe(
  702 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:699:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize gif (not animated)

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  714 |     const opts = { headers: { accept: 'image/webp' } }
  715 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 716 |     expect(res.status).toBe(200)
      |                        ^
  717 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  718 |     expect(res.headers.get('Cache-Control')).toBe(
  719 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:716:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  731 |     const opts = { headers: { accept: 'image/webp' } }
  732 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 733 |     expect(res.status).toBe(200)
      |                        ^
  734 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  735 |     expect(res.headers.get('Cache-Control')).toBe(
  736 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:733:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  748 |     const opts = { headers: { accept: 'image/webp' } }
  749 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 750 |     expect(res.status).toBe(200)
      |                        ^
  751 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  752 |     expect(res.headers.get('Cache-Control')).toBe(
  753 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:750:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize relative url and old Chrome accept header as webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  767 |     }
  768 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 769 |     expect(res.status).toBe(200)
      |                        ^
  770 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  771 |     expect(res.headers.get('Cache-Control')).toBe(
  772 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:769:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize relative url and new Chrome accept header as avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  789 |       }
  790 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 791 |       expect(res.status).toBe(200)
      |                          ^
  792 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  793 |       expect(res.headers.get('Cache-Control')).toBe(
  794 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:791:26)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize avif and maintain format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  806 |       const opts = { headers: { accept: 'image/avif' } }
  807 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 808 |       expect(res.status).toBe(200)
      |                          ^
  809 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  810 |       expect(res.headers.get('Cache-Control')).toBe(
  811 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:808:26)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should compress avif smaller than webp at q=100

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:822:7)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should compress avif smaller than webp at q=75

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:826:7)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should compress avif smaller than webp at q=50

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:830:7)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should resize absolute url from localhost

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  838 |       const opts = { headers: { accept: 'image/webp' } }
  839 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 840 |       expect(res.status).toBe(200)
      |                          ^
  841 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  842 |       expect(res.headers.get('Cache-Control')).toBe(
  843 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:840:26)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should automatically detect image type when content-type is octet-stream

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  861 |       const opts = { headers: { accept: 'image/webp' } }
  862 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 863 |       expect(res.status).toBe(200)
      |                          ^
  864 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  865 |       expect(res.headers.get('Cache-Control')).toBe(
  866 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:863:26)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for external image

expect(received).toBeGreaterThan(expected)

Expected: > 500
Received:   3

  894 |         opts
  895 |       )
> 896 |       expect(one.duration).toBeGreaterThan(delay)
      |                            ^
  897 |       expect(one.res.status).toBe(200)
  898 |       expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  899 |       expect(one.res.headers.get('Content-Type')).toBe('image/webp')

  at Object.toBeGreaterThan (integration/image-optimizer/test/util.ts:896:28)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › recursive url is not allowed › should pass with absolute next image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1047 |         const query = { url: fullUrl, w: ctx.w, q: 1 }
  1048 |         const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1049 |         expect(res.status).toBe(200)
       |                            ^
  1050 |         await expectWidth(res, ctx.w)
  1051 |       })
  1052 |     } else {

  at Object.toBe (integration/image-optimizer/test/util.ts:1049:28)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should fail when internal url is not an image

expect(received).toBe(expected) // Object.is equality

Expected: "Unable to optimize image and unable to fallback to upstream image"
Received: "\"q\" parameter (quality) of 39 is not allowed"

  1076 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1077 |     expect(res.status).toBe(400)
> 1078 |     expect(await res.text()).toBe(
       |                              ^
  1079 |       `Unable to optimize image and unable to fallback to upstream image`
  1080 |     )
  1081 |   })

  at Object.toBe (integration/image-optimizer/test/util.ts:1078:30)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should fail when url fails to load an image

expect(received).toBe(expected) // Object.is equality

Expected: 404
Received: 400

  1086 |       const query = { w: ctx.w, url, q: 100 }
  1087 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1088 |       expect(res.status).toBe(404)
       |                          ^
  1089 |       expect(await res.text()).toBe(
  1090 |         `"url" parameter is valid but upstream response is invalid`
  1091 |       )

  at Object.toBe (integration/image-optimizer/test/util.ts:1088:26)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for internal image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1115 |       opts
  1116 |     )
> 1117 |     expect(one.res.status).toBe(200)
       |                            ^
  1118 |     expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1119 |     expect(one.res.headers.get('Content-Type')).toBe('image/webp')
  1120 |     expect(one.res.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1117:28)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should use cached image file when parameters are the same for animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1250 |
  1251 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1252 |     expect(res1.status).toBe(200)
       |                         ^
  1253 |     expect(res1.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1254 |     expect(res1.headers.get('Content-Type')).toBe('image/gif')
  1255 |     expect(res1.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1252:25)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should set 304 status without body when etag matches if-none-match

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1279 |
  1280 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts1)
> 1281 |     expect(res1.status).toBe(200)
       |                         ^
  1282 |     expect(res1.headers.get('Content-Type')).toBe('image/webp')
  1283 |     expect(res1.headers.get('Cache-Control')).toBe(
  1284 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1281:25)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should maintain bmp

ENOENT: no such file or directory, scandir '/root/actions-runner/_work/next.js/next.js/test/integration/image-optimizer/app/.next/cache/images'

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should not resize if requested width is larger than original source image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1354 |     const opts = { headers: { accept: 'image/webp' } }
  1355 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1356 |     expect(res.status).toBe(200)
       |                        ^
  1357 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  1358 |     expect(res.headers.get('Cache-Control')).toBe(
  1359 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1356:24)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should error if the resource isn't a valid image

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1407 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1408 |     expect(res.status).toBe(400)
> 1409 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1410 |   })
  1411 |
  1412 |   it('should error if the image file does not exist', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:1409:30)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should error if the image file does not exist

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1415 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1416 |     expect(res.status).toBe(400)
> 1417 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1418 |   })
  1419 |
  1420 |   if (domains.length > 0) {

  at Object.toBe (integration/image-optimizer/test/util.ts:1417:30)

● with minimumCacheTTL of 5 sec › dev support with next.config.js › should handle concurrent requests

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1438 |       }
  1439 |
> 1440 |       expect(res1.status).toBe(200)
       |                           ^
  1441 |       expect(res2.status).toBe(200)
  1442 |       expect(res3.status).toBe(200)
  1443 |

  at Object.toBe (integration/image-optimizer/test/util.ts:1440:27)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-new/both-basepath-trailingslash/test/index.test.ts (turbopack)

• Image Component basePath + trailingSlash Tests > development mode > should correctly load image src from import
• Image Component basePath + trailingSlash Tests > development mode > should correctly load image src from string

Expand output

● Image Component basePath + trailingSlash Tests › development mode › should correctly load image src from import

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  27 |     )
  28 |     const res = await fetchViaHTTP(appPort, src)
> 29 |     expect(res.status).toBe(200)
     |                        ^
  30 |     expect(res.headers.get('content-type')).toBe('image/jpeg')
  31 |   })
  32 |   it('should correctly load image src from string', async () => {

  at Object.toBe (integration/next-image-new/both-basepath-trailingslash/test/index.test.ts:29:24)

● Image Component basePath + trailingSlash Tests › development mode › should correctly load image src from import

expect.assertions(3)

Expected three assertions to be called but received two assertion calls.

  19 | const runTests = () => {
  20 |   it('should correctly load image src from import', async () => {
> 21 |     expect.assertions(3)
     |            ^
  22 |     const browser = await webdriver(appPort, '/prefix/')
  23 |     const img = await browser.elementById('import-img')
  24 |     const src = await img.getAttribute('src')

  at Object.assertions (integration/next-image-new/both-basepath-trailingslash/test/index.test.ts:21:12)

● Image Component basePath + trailingSlash Tests › development mode › should correctly load image src from string

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  37 |     expect(src).toBe('/prefix/_next/image/?url=%2Fprefix%2Ftest.jpg&w=640&q=75')
  38 |     const res = await fetchViaHTTP(appPort, src)
> 39 |     expect(res.status).toBe(200)
     |                        ^
  40 |     expect(res.headers.get('content-type')).toBe('image/jpeg')
  41 |   })
  42 | }

  at Object.toBe (integration/next-image-new/both-basepath-trailingslash/test/index.test.ts:39:24)

● Image Component basePath + trailingSlash Tests › development mode › should correctly load image src from string

expect.assertions(3)

Expected three assertions to be called but received two assertion calls.

  31 |   })
  32 |   it('should correctly load image src from string', async () => {
> 33 |     expect.assertions(3)
     |            ^
  34 |     const browser = await webdriver(appPort, '/prefix/')
  35 |     const img = await browser.elementById('string-img')
  36 |     const src = await img.getAttribute('src')

  at Object.assertions (integration/next-image-new/both-basepath-trailingslash/test/index.test.ts:33:12)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/image-optimizer/test/content-disposition-type.test.ts (turbopack)

• with contentDispositionType inline > dev support with next.config.js > should normalize invalid status codes
• with contentDispositionType inline > dev support with next.config.js > should timeout for upstream image exceeding 7 seconds
• with contentDispositionType inline > dev support with next.config.js > should handle non-ascii characters in image url
• with contentDispositionType inline > dev support with next.config.js > should maintain icns
• with contentDispositionType inline > dev support with next.config.js > should maintain pic/pct
• with contentDispositionType inline > dev support with next.config.js > should maintain animated gif
• with contentDispositionType inline > dev support with next.config.js > should maintain animated png
• with contentDispositionType inline > dev support with next.config.js > should maintain animated png 2
• with contentDispositionType inline > dev support with next.config.js > should maintain animated webp
• with contentDispositionType inline > dev support with next.config.js > should not allow vector svg
• with contentDispositionType inline > dev support with next.config.js > should not allow svg with application header
• with contentDispositionType inline > dev support with next.config.js > should not allow svg with comma header
• with contentDispositionType inline > dev support with next.config.js > should not allow svg with uppercase header
• with contentDispositionType inline > dev support with next.config.js > should not allow svg with wrong header
• with contentDispositionType inline > dev support with next.config.js > should maintain ico format
• with contentDispositionType inline > dev support with next.config.js > should maintain jpg format for old Safari
• with contentDispositionType inline > dev support with next.config.js > should maintain png format for old Safari
• with contentDispositionType inline > dev support with next.config.js > should downlevel webp format to jpeg for old Safari
• with contentDispositionType inline > dev support with next.config.js > should downlevel avif format to jpeg for old Safari
• with contentDispositionType inline > dev support with next.config.js > should resize relative url and webp Firefox accept header
• with contentDispositionType inline > dev support with next.config.js > should resize relative url and png accept header
• with contentDispositionType inline > dev support with next.config.js > should resize relative url with invalid accept header as png
• with contentDispositionType inline > dev support with next.config.js > should resize relative url with invalid accept header as gif
• with contentDispositionType inline > dev support with next.config.js > should resize relative url with invalid accept header as tiff
• with contentDispositionType inline > dev support with next.config.js > should resize gif (not animated)
• with contentDispositionType inline > dev support with next.config.js > should resize tiff
• with contentDispositionType inline > dev support with next.config.js > should resize avif
• with contentDispositionType inline > dev support with next.config.js > should resize relative url and old Chrome accept header as webp
• with contentDispositionType inline > dev support with next.config.js > should resize relative url and new Chrome accept header as avif
• with contentDispositionType inline > dev support with next.config.js > should resize avif and maintain format
• with contentDispositionType inline > dev support with next.config.js > should compress avif smaller than webp at q=100
• with contentDispositionType inline > dev support with next.config.js > should compress avif smaller than webp at q=75
• with contentDispositionType inline > dev support with next.config.js > should compress avif smaller than webp at q=50
• with contentDispositionType inline > dev support with next.config.js > should resize absolute url from localhost
• with contentDispositionType inline > dev support with next.config.js > should automatically detect image type when content-type is octet-stream
• with contentDispositionType inline > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for external image
• with contentDispositionType inline > dev support with next.config.js > should fail when internal url is not an image
• with contentDispositionType inline > dev support with next.config.js > should fail when url fails to load an image
• with contentDispositionType inline > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for internal image
• with contentDispositionType inline > dev support with next.config.js > should use cached image file when parameters are the same for animated gif
• with contentDispositionType inline > dev support with next.config.js > should set 304 status without body when etag matches if-none-match
• with contentDispositionType inline > dev support with next.config.js > should maintain bmp
• with contentDispositionType inline > dev support with next.config.js > should not resize if requested width is larger than original source image
• with contentDispositionType inline > dev support with next.config.js > should error if the resource isn't a valid image
• with contentDispositionType inline > dev support with next.config.js > should error if the image file does not exist
• with contentDispositionType inline > dev support with next.config.js > should handle concurrent requests
• with contentDispositionType inline > dev support with next.config.js > recursive url is not allowed > should pass with absolute next image url

Expand output

● with contentDispositionType inline › dev support with next.config.js › should normalize invalid status codes

expect(received).toBe(expected) // Object.is equality

Expected: 500
Received: 400

  177 |
  178 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 179 |       expect(res.status).toBe(500)
      |                          ^
  180 |     })
  181 |
  182 |     it('should timeout for upstream image exceeding 7 seconds', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:179:26)

● with contentDispositionType inline › dev support with next.config.js › should timeout for upstream image exceeding 7 seconds

expect(received).toBe(expected) // Object.is equality

Expected: 504
Received: 400

  184 |       const query = { url, w: ctx.w, q: 100 }
  185 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 186 |       expect(res.status).toBe(504)
      |                          ^
  187 |     })
  188 |   }
  189 |

  at Object.toBe (integration/image-optimizer/test/util.ts:186:26)

● with contentDispositionType inline › dev support with next.config.js › should handle non-ascii characters in image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  196 |     const query = { w: ctx.w, q: 90, url: '/äöüščří.png' }
  197 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 198 |     expect(res.status).toBe(200)
      |                        ^
  199 |   })
  200 |
  201 |   it('should maintain icns', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:198:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain icns

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  202 |     const query = { w: ctx.w, q: 90, url: '/test.icns' }
  203 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 204 |     expect(res.status).toBe(200)
      |                        ^
  205 |     expect(res.headers.get('Content-Type')).toContain('image/x-icns')
  206 |     expect(res.headers.get('Cache-Control')).toBe(
  207 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:204:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain pic/pct

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  218 |     const query = { w: ctx.w, q: 90, url: '/test.pic' }
  219 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 220 |     expect(res.status).toBe(200)
      |                        ^
  221 |     expect(res.headers.get('Content-Type')).toContain('image/x-pict')
  222 |     expect(res.headers.get('Cache-Control')).toBe(
  223 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:220:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  239 |     const query = { w: ctx.w, q: 90, url: '/animated.gif' }
  240 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 241 |     expect(res.status).toBe(200)
      |                        ^
  242 |     expect(res.headers.get('content-type')).toContain('image/gif')
  243 |     expect(res.headers.get('Cache-Control')).toBe(
  244 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:241:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain animated png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  256 |     const query = { w: ctx.w, q: 90, url: '/animated.png' }
  257 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 258 |     expect(res.status).toBe(200)
      |                        ^
  259 |     expect(res.headers.get('content-type')).toContain('image/png')
  260 |     expect(res.headers.get('Cache-Control')).toBe(
  261 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:258:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain animated png 2

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  273 |     const query = { w: ctx.w, q: 90, url: '/animated2.png' }
  274 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 275 |     expect(res.status).toBe(200)
      |                        ^
  276 |     expect(res.headers.get('content-type')).toContain('image/png')
  277 |     expect(res.headers.get('Cache-Control')).toBe(
  278 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:275:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain animated webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  290 |     const query = { w: ctx.w, q: 90, url: '/animated.webp' }
  291 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 292 |     expect(res.status).toBe(200)
      |                        ^
  293 |     expect(res.headers.get('content-type')).toContain('image/webp')
  294 |     expect(res.headers.get('Cache-Control')).toBe(
  295 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:292:24)

● with contentDispositionType inline › dev support with next.config.js › should not allow vector svg

expect(received).toContain(expected) // indexOf

Expected substring: "valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 35 is not allowed"

  341 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  342 |       expect(res.status).toBe(400)
> 343 |       expect(await res.text()).toContain('valid but image type is not allowed')
      |                                ^
  344 |     })
  345 |
  346 |     it('should not allow svg with application header', async () => {

  at Object.toContain (integration/image-optimizer/test/util.ts:343:32)

● with contentDispositionType inline › dev support with next.config.js › should not allow svg with application header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 45 is not allowed"

  349 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  350 |       expect(res.status).toBe(400)
> 351 |       expect(await res.text()).toContain(
      |                                ^
  352 |         "The requested resource isn't a valid image"
  353 |       )
  354 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:351:32)

● with contentDispositionType inline › dev support with next.config.js › should not allow svg with comma header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 55 is not allowed"

  359 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  360 |       expect(res.status).toBe(400)
> 361 |       expect(await res.text()).toContain(
      |                                ^
  362 |         "The requested resource isn't a valid image"
  363 |       )
  364 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:361:32)

● with contentDispositionType inline › dev support with next.config.js › should not allow svg with uppercase header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  369 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  370 |       expect(res.status).toBe(400)
> 371 |       expect(await res.text()).toContain(
      |                                ^
  372 |         '"url" parameter is valid but image type is not allowed'
  373 |       )
  374 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:371:32)

● with contentDispositionType inline › dev support with next.config.js › should not allow svg with wrong header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  379 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  380 |       expect(res.status).toBe(400)
> 381 |       expect(await res.text()).toContain(
      |                                ^
  382 |         '"url" parameter is valid but image type is not allowed'
  383 |       )
  384 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:381:32)

● with contentDispositionType inline › dev support with next.config.js › should maintain ico format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  389 |     const opts = { headers: { accept: 'image/webp' } }
  390 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 391 |     expect(res.status).toBe(200)
      |                        ^
  392 |     expect(res.headers.get('Content-Type')).toContain('image/x-icon')
  393 |     expect(res.headers.get('Cache-Control')).toBe(
  394 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:391:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain jpg format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  413 |     const opts = { headers: { accept } }
  414 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 415 |     expect(res.status).toBe(200)
      |                        ^
  416 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  417 |     expect(res.headers.get('Cache-Control')).toBe(
  418 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:415:24)

● with contentDispositionType inline › dev support with next.config.js › should maintain png format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  431 |     const opts = { headers: { accept } }
  432 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 433 |     expect(res.status).toBe(200)
      |                        ^
  434 |     expect(res.headers.get('Content-Type')).toContain('image/png')
  435 |     expect(res.headers.get('Cache-Control')).toBe(
  436 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:433:24)

● with contentDispositionType inline › dev support with next.config.js › should downlevel webp format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  449 |     const opts = { headers: { accept } }
  450 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 451 |     expect(res.status).toBe(200)
      |                        ^
  452 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  453 |     expect(res.headers.get('Cache-Control')).toBe(
  454 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:451:24)

● with contentDispositionType inline › dev support with next.config.js › should downlevel avif format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  468 |     const opts = { headers: { accept } }
  469 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 470 |     expect(res.status).toBe(200)
      |                        ^
  471 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  472 |     expect(res.headers.get('Cache-Control')).toBe(
  473 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:470:24)

● with contentDispositionType inline › dev support with next.config.js › should resize relative url and webp Firefox accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  629 |     const opts = { headers: { accept: 'image/webp,*/*' } }
  630 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 631 |     expect(res.status).toBe(200)
      |                        ^
  632 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  633 |     expect(res.headers.get('Cache-Control')).toBe(
  634 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:631:24)

● with contentDispositionType inline › dev support with next.config.js › should resize relative url and png accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  646 |     const opts = { headers: { accept: 'image/png' } }
  647 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 648 |     expect(res.status).toBe(200)
      |                        ^
  649 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  650 |     expect(res.headers.get('Cache-Control')).toBe(
  651 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:648:24)

● with contentDispositionType inline › dev support with next.config.js › should resize relative url with invalid accept header as png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  663 |     const opts = { headers: { accept: 'image/invalid' } }
  664 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 665 |     expect(res.status).toBe(200)
      |                        ^
  666 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  667 |     expect(res.headers.get('Cache-Control')).toBe(
  668 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:665:24)

● with contentDispositionType inline › dev support with next.config.js › should resize relative url with invalid accept header as gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  680 |     const opts = { headers: { accept: 'image/invalid' } }
  681 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 682 |     expect(res.status).toBe(200)
      |                        ^
  683 |     expect(res.headers.get('Content-Type')).toBe('image/gif')
  684 |     expect(res.headers.get('Cache-Control')).toBe(
  685 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:682:24)

● with contentDispositionType inline › dev support with next.config.js › should resize relative url with invalid accept header as tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  697 |     const opts = { headers: { accept: 'image/invalid' } }
  698 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 699 |     expect(res.status).toBe(200)
      |                        ^
  700 |     expect(res.headers.get('Content-Type')).toBe('image/tiff')
  701 |     expect(res.headers.get('Cache-Control')).toBe(
  702 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:699:24)

● with contentDispositionType inline › dev support with next.config.js › should resize gif (not animated)

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  714 |     const opts = { headers: { accept: 'image/webp' } }
  715 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 716 |     expect(res.status).toBe(200)
      |                        ^
  717 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  718 |     expect(res.headers.get('Cache-Control')).toBe(
  719 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:716:24)

● with contentDispositionType inline › dev support with next.config.js › should resize tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  731 |     const opts = { headers: { accept: 'image/webp' } }
  732 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 733 |     expect(res.status).toBe(200)
      |                        ^
  734 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  735 |     expect(res.headers.get('Cache-Control')).toBe(
  736 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:733:24)

● with contentDispositionType inline › dev support with next.config.js › should resize avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  748 |     const opts = { headers: { accept: 'image/webp' } }
  749 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 750 |     expect(res.status).toBe(200)
      |                        ^
  751 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  752 |     expect(res.headers.get('Cache-Control')).toBe(
  753 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:750:24)

● with contentDispositionType inline › dev support with next.config.js › should resize relative url and old Chrome accept header as webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  767 |     }
  768 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 769 |     expect(res.status).toBe(200)
      |                        ^
  770 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  771 |     expect(res.headers.get('Cache-Control')).toBe(
  772 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:769:24)

● with contentDispositionType inline › dev support with next.config.js › should resize relative url and new Chrome accept header as avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  789 |       }
  790 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 791 |       expect(res.status).toBe(200)
      |                          ^
  792 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  793 |       expect(res.headers.get('Cache-Control')).toBe(
  794 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:791:26)

● with contentDispositionType inline › dev support with next.config.js › should resize avif and maintain format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  806 |       const opts = { headers: { accept: 'image/avif' } }
  807 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 808 |       expect(res.status).toBe(200)
      |                          ^
  809 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  810 |       expect(res.headers.get('Cache-Control')).toBe(
  811 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:808:26)

● with contentDispositionType inline › dev support with next.config.js › should compress avif smaller than webp at q=100

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:822:7)

● with contentDispositionType inline › dev support with next.config.js › should compress avif smaller than webp at q=75

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:826:7)

● with contentDispositionType inline › dev support with next.config.js › should compress avif smaller than webp at q=50

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:830:7)

● with contentDispositionType inline › dev support with next.config.js › should resize absolute url from localhost

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  838 |       const opts = { headers: { accept: 'image/webp' } }
  839 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 840 |       expect(res.status).toBe(200)
      |                          ^
  841 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  842 |       expect(res.headers.get('Cache-Control')).toBe(
  843 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:840:26)

● with contentDispositionType inline › dev support with next.config.js › should automatically detect image type when content-type is octet-stream

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  861 |       const opts = { headers: { accept: 'image/webp' } }
  862 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 863 |       expect(res.status).toBe(200)
      |                          ^
  864 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  865 |       expect(res.headers.get('Cache-Control')).toBe(
  866 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:863:26)

● with contentDispositionType inline › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for external image

expect(received).toBeGreaterThan(expected)

Expected: > 500
Received:   2

  894 |         opts
  895 |       )
> 896 |       expect(one.duration).toBeGreaterThan(delay)
      |                            ^
  897 |       expect(one.res.status).toBe(200)
  898 |       expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  899 |       expect(one.res.headers.get('Content-Type')).toBe('image/webp')

  at Object.toBeGreaterThan (integration/image-optimizer/test/util.ts:896:28)

● with contentDispositionType inline › dev support with next.config.js › recursive url is not allowed › should pass with absolute next image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1047 |         const query = { url: fullUrl, w: ctx.w, q: 1 }
  1048 |         const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1049 |         expect(res.status).toBe(200)
       |                            ^
  1050 |         await expectWidth(res, ctx.w)
  1051 |       })
  1052 |     } else {

  at Object.toBe (integration/image-optimizer/test/util.ts:1049:28)

● with contentDispositionType inline › dev support with next.config.js › should fail when internal url is not an image

expect(received).toBe(expected) // Object.is equality

Expected: "Unable to optimize image and unable to fallback to upstream image"
Received: "\"q\" parameter (quality) of 39 is not allowed"

  1076 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1077 |     expect(res.status).toBe(400)
> 1078 |     expect(await res.text()).toBe(
       |                              ^
  1079 |       `Unable to optimize image and unable to fallback to upstream image`
  1080 |     )
  1081 |   })

  at Object.toBe (integration/image-optimizer/test/util.ts:1078:30)

● with contentDispositionType inline › dev support with next.config.js › should fail when url fails to load an image

expect(received).toBe(expected) // Object.is equality

Expected: 404
Received: 400

  1086 |       const query = { w: ctx.w, url, q: 100 }
  1087 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1088 |       expect(res.status).toBe(404)
       |                          ^
  1089 |       expect(await res.text()).toBe(
  1090 |         `"url" parameter is valid but upstream response is invalid`
  1091 |       )

  at Object.toBe (integration/image-optimizer/test/util.ts:1088:26)

● with contentDispositionType inline › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for internal image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1115 |       opts
  1116 |     )
> 1117 |     expect(one.res.status).toBe(200)
       |                            ^
  1118 |     expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1119 |     expect(one.res.headers.get('Content-Type')).toBe('image/webp')
  1120 |     expect(one.res.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1117:28)

● with contentDispositionType inline › dev support with next.config.js › should use cached image file when parameters are the same for animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1250 |
  1251 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1252 |     expect(res1.status).toBe(200)
       |                         ^
  1253 |     expect(res1.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1254 |     expect(res1.headers.get('Content-Type')).toBe('image/gif')
  1255 |     expect(res1.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1252:25)

● with contentDispositionType inline › dev support with next.config.js › should set 304 status without body when etag matches if-none-match

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1279 |
  1280 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts1)
> 1281 |     expect(res1.status).toBe(200)
       |                         ^
  1282 |     expect(res1.headers.get('Content-Type')).toBe('image/webp')
  1283 |     expect(res1.headers.get('Cache-Control')).toBe(
  1284 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1281:25)

● with contentDispositionType inline › dev support with next.config.js › should maintain bmp

ENOENT: no such file or directory, scandir '/root/actions-runner/_work/next.js/next.js/test/integration/image-optimizer/app/.next/cache/images'

● with contentDispositionType inline › dev support with next.config.js › should not resize if requested width is larger than original source image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1354 |     const opts = { headers: { accept: 'image/webp' } }
  1355 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1356 |     expect(res.status).toBe(200)
       |                        ^
  1357 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  1358 |     expect(res.headers.get('Cache-Control')).toBe(
  1359 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1356:24)

● with contentDispositionType inline › dev support with next.config.js › should error if the resource isn't a valid image

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1407 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1408 |     expect(res.status).toBe(400)
> 1409 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1410 |   })
  1411 |
  1412 |   it('should error if the image file does not exist', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:1409:30)

● with contentDispositionType inline › dev support with next.config.js › should error if the image file does not exist

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1415 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1416 |     expect(res.status).toBe(400)
> 1417 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1418 |   })
  1419 |
  1420 |   if (domains.length > 0) {

  at Object.toBe (integration/image-optimizer/test/util.ts:1417:30)

● with contentDispositionType inline › dev support with next.config.js › should handle concurrent requests

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1438 |       }
  1439 |
> 1440 |       expect(res1.status).toBe(200)
       |                           ^
  1441 |       expect(res2.status).toBe(200)
  1442 |       expect(res3.status).toBe(200)
  1443 |

  at Object.toBe (integration/image-optimizer/test/util.ts:1440:27)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-new/default/test/static.test.ts (turbopack)

• Static Image Component Tests > development mode > should load direct imported image
• Static Image Component Tests > development mode > should load staticprops imported image

Expand output

● Static Image Component Tests › development mode › should load direct imported image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  218 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  219 |     const res = await fetch(fullSrc)
> 220 |     expect(res.status).toBe(200)
      |                        ^
  221 |   })
  222 |
  223 |   it('should load staticprops imported image', async () => {

  at Object.toBe (integration/next-image-new/default/test/static.test.ts:220:24)

● Static Image Component Tests › development mode › should load staticprops imported image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  230 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  231 |     const res = await fetch(fullSrc)
> 232 |     expect(res.status).toBe(200)
      |                        ^
  233 |   })
  234 | }
  235 |

  at Object.toBe (integration/next-image-new/default/test/static.test.ts:232:24)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/image-optimizer/test/sharp.test.ts (turbopack)

• with latest sharp > dev support w/o next.config.js > should handle non-ascii characters in image url
• with latest sharp > dev support w/o next.config.js > should maintain icns
• with latest sharp > dev support w/o next.config.js > should maintain pic/pct
• with latest sharp > dev support w/o next.config.js > should maintain animated gif
• with latest sharp > dev support w/o next.config.js > should maintain animated png
• with latest sharp > dev support w/o next.config.js > should maintain animated png 2
• with latest sharp > dev support w/o next.config.js > should maintain animated webp
• with latest sharp > dev support w/o next.config.js > should not allow vector svg
• with latest sharp > dev support w/o next.config.js > should not allow svg with application header
• with latest sharp > dev support w/o next.config.js > should not allow svg with comma header
• with latest sharp > dev support w/o next.config.js > should not allow svg with uppercase header
• with latest sharp > dev support w/o next.config.js > should not allow svg with wrong header
• with latest sharp > dev support w/o next.config.js > should maintain ico format
• with latest sharp > dev support w/o next.config.js > should maintain jpg format for old Safari
• with latest sharp > dev support w/o next.config.js > should maintain png format for old Safari
• with latest sharp > dev support w/o next.config.js > should downlevel webp format to jpeg for old Safari
• with latest sharp > dev support w/o next.config.js > should downlevel avif format to jpeg for old Safari
• with latest sharp > dev support w/o next.config.js > should resize relative url and webp Firefox accept header
• with latest sharp > dev support w/o next.config.js > should resize relative url and png accept header
• with latest sharp > dev support w/o next.config.js > should resize relative url with invalid accept header as png
• with latest sharp > dev support w/o next.config.js > should resize relative url with invalid accept header as gif
• with latest sharp > dev support w/o next.config.js > should resize relative url with invalid accept header as tiff
• with latest sharp > dev support w/o next.config.js > should resize gif (not animated)
• with latest sharp > dev support w/o next.config.js > should resize tiff
• with latest sharp > dev support w/o next.config.js > should resize avif
• with latest sharp > dev support w/o next.config.js > should resize relative url and old Chrome accept header as webp
• with latest sharp > dev support w/o next.config.js > should fail when internal url is not an image
• with latest sharp > dev support w/o next.config.js > should use cache and stale-while-revalidate when query is the same for internal image
• with latest sharp > dev support w/o next.config.js > should use cached image file when parameters are the same for animated gif
• with latest sharp > dev support w/o next.config.js > should set 304 status without body when etag matches if-none-match
• with latest sharp > dev support w/o next.config.js > should maintain bmp
• with latest sharp > dev support w/o next.config.js > should not resize if requested width is larger than original source image
• with latest sharp > dev support w/o next.config.js > should error if the resource isn't a valid image
• with latest sharp > dev support w/o next.config.js > should error if the image file does not exist
• with latest sharp > dev support with next.config.js > should normalize invalid status codes
• with latest sharp > dev support with next.config.js > should timeout for upstream image exceeding 7 seconds
• with latest sharp > dev support with next.config.js > should handle non-ascii characters in image url
• with latest sharp > dev support with next.config.js > should maintain icns
• with latest sharp > dev support with next.config.js > should maintain pic/pct
• with latest sharp > dev support with next.config.js > should maintain animated gif
• with latest sharp > dev support with next.config.js > should maintain animated png
• with latest sharp > dev support with next.config.js > should maintain animated png 2
• with latest sharp > dev support with next.config.js > should maintain animated webp
• with latest sharp > dev support with next.config.js > should not allow vector svg
• with latest sharp > dev support with next.config.js > should not allow svg with application header
• with latest sharp > dev support with next.config.js > should not allow svg with comma header
• with latest sharp > dev support with next.config.js > should not allow svg with uppercase header
• with latest sharp > dev support with next.config.js > should not allow svg with wrong header
• with latest sharp > dev support with next.config.js > should maintain ico format
• with latest sharp > dev support with next.config.js > should maintain jpg format for old Safari
• with latest sharp > dev support with next.config.js > should maintain png format for old Safari
• with latest sharp > dev support with next.config.js > should downlevel webp format to jpeg for old Safari
• with latest sharp > dev support with next.config.js > should downlevel avif format to jpeg for old Safari
• with latest sharp > dev support with next.config.js > should resize relative url and webp Firefox accept header
• with latest sharp > dev support with next.config.js > should resize relative url and png accept header
• with latest sharp > dev support with next.config.js > should resize relative url with invalid accept header as png
• with latest sharp > dev support with next.config.js > should resize relative url with invalid accept header as gif
• with latest sharp > dev support with next.config.js > should resize relative url with invalid accept header as tiff
• with latest sharp > dev support with next.config.js > should resize gif (not animated)
• with latest sharp > dev support with next.config.js > should resize tiff
• with latest sharp > dev support with next.config.js > should resize avif
• with latest sharp > dev support with next.config.js > should resize relative url and old Chrome accept header as webp
• with latest sharp > dev support with next.config.js > should resize relative url and new Chrome accept header as avif
• with latest sharp > dev support with next.config.js > should resize avif and maintain format
• with latest sharp > dev support with next.config.js > should compress avif smaller than webp at q=100
• with latest sharp > dev support with next.config.js > should compress avif smaller than webp at q=75
• with latest sharp > dev support with next.config.js > should compress avif smaller than webp at q=50
• with latest sharp > dev support with next.config.js > should resize absolute url from localhost
• with latest sharp > dev support with next.config.js > should automatically detect image type when content-type is octet-stream
• with latest sharp > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for external image
• with latest sharp > dev support with next.config.js > should fail when internal url is not an image
• with latest sharp > dev support with next.config.js > should fail when url fails to load an image
• with latest sharp > dev support with next.config.js > should use cache and stale-while-revalidate when query is the same for internal image
• with latest sharp > dev support with next.config.js > should use cached image file when parameters are the same for animated gif
• with latest sharp > dev support with next.config.js > should set 304 status without body when etag matches if-none-match
• with latest sharp > dev support with next.config.js > should maintain bmp
• with latest sharp > dev support with next.config.js > should not resize if requested width is larger than original source image
• with latest sharp > dev support with next.config.js > should error if the resource isn't a valid image
• with latest sharp > dev support with next.config.js > should error if the image file does not exist
• with latest sharp > dev support with next.config.js > should handle concurrent requests
• with latest sharp > dev support with next.config.js > recursive url is not allowed > should pass with absolute next image url

Expand output

● with latest sharp › dev support w/o next.config.js › should handle non-ascii characters in image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  196 |     const query = { w: ctx.w, q: 90, url: '/äöüščří.png' }
  197 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 198 |     expect(res.status).toBe(200)
      |                        ^
  199 |   })
  200 |
  201 |   it('should maintain icns', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:198:24)

● with latest sharp › dev support w/o next.config.js › should maintain icns

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  202 |     const query = { w: ctx.w, q: 90, url: '/test.icns' }
  203 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 204 |     expect(res.status).toBe(200)
      |                        ^
  205 |     expect(res.headers.get('Content-Type')).toContain('image/x-icns')
  206 |     expect(res.headers.get('Cache-Control')).toBe(
  207 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:204:24)

● with latest sharp › dev support w/o next.config.js › should maintain pic/pct

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  218 |     const query = { w: ctx.w, q: 90, url: '/test.pic' }
  219 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 220 |     expect(res.status).toBe(200)
      |                        ^
  221 |     expect(res.headers.get('Content-Type')).toContain('image/x-pict')
  222 |     expect(res.headers.get('Cache-Control')).toBe(
  223 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:220:24)

● with latest sharp › dev support w/o next.config.js › should maintain animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  239 |     const query = { w: ctx.w, q: 90, url: '/animated.gif' }
  240 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 241 |     expect(res.status).toBe(200)
      |                        ^
  242 |     expect(res.headers.get('content-type')).toContain('image/gif')
  243 |     expect(res.headers.get('Cache-Control')).toBe(
  244 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:241:24)

● with latest sharp › dev support w/o next.config.js › should maintain animated png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  256 |     const query = { w: ctx.w, q: 90, url: '/animated.png' }
  257 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 258 |     expect(res.status).toBe(200)
      |                        ^
  259 |     expect(res.headers.get('content-type')).toContain('image/png')
  260 |     expect(res.headers.get('Cache-Control')).toBe(
  261 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:258:24)

● with latest sharp › dev support w/o next.config.js › should maintain animated png 2

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  273 |     const query = { w: ctx.w, q: 90, url: '/animated2.png' }
  274 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 275 |     expect(res.status).toBe(200)
      |                        ^
  276 |     expect(res.headers.get('content-type')).toContain('image/png')
  277 |     expect(res.headers.get('Cache-Control')).toBe(
  278 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:275:24)

● with latest sharp › dev support w/o next.config.js › should maintain animated webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  290 |     const query = { w: ctx.w, q: 90, url: '/animated.webp' }
  291 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 292 |     expect(res.status).toBe(200)
      |                        ^
  293 |     expect(res.headers.get('content-type')).toContain('image/webp')
  294 |     expect(res.headers.get('Cache-Control')).toBe(
  295 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:292:24)

● with latest sharp › dev support w/o next.config.js › should not allow vector svg

expect(received).toContain(expected) // indexOf

Expected substring: "valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 35 is not allowed"

  341 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  342 |       expect(res.status).toBe(400)
> 343 |       expect(await res.text()).toContain('valid but image type is not allowed')
      |                                ^
  344 |     })
  345 |
  346 |     it('should not allow svg with application header', async () => {

  at Object.toContain (integration/image-optimizer/test/util.ts:343:32)

● with latest sharp › dev support w/o next.config.js › should not allow svg with application header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 45 is not allowed"

  349 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  350 |       expect(res.status).toBe(400)
> 351 |       expect(await res.text()).toContain(
      |                                ^
  352 |         "The requested resource isn't a valid image"
  353 |       )
  354 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:351:32)

● with latest sharp › dev support w/o next.config.js › should not allow svg with comma header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 55 is not allowed"

  359 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  360 |       expect(res.status).toBe(400)
> 361 |       expect(await res.text()).toContain(
      |                                ^
  362 |         "The requested resource isn't a valid image"
  363 |       )
  364 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:361:32)

● with latest sharp › dev support w/o next.config.js › should not allow svg with uppercase header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  369 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  370 |       expect(res.status).toBe(400)
> 371 |       expect(await res.text()).toContain(
      |                                ^
  372 |         '"url" parameter is valid but image type is not allowed'
  373 |       )
  374 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:371:32)

● with latest sharp › dev support w/o next.config.js › should not allow svg with wrong header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  379 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  380 |       expect(res.status).toBe(400)
> 381 |       expect(await res.text()).toContain(
      |                                ^
  382 |         '"url" parameter is valid but image type is not allowed'
  383 |       )
  384 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:381:32)

● with latest sharp › dev support w/o next.config.js › should maintain ico format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  389 |     const opts = { headers: { accept: 'image/webp' } }
  390 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 391 |     expect(res.status).toBe(200)
      |                        ^
  392 |     expect(res.headers.get('Content-Type')).toContain('image/x-icon')
  393 |     expect(res.headers.get('Cache-Control')).toBe(
  394 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:391:24)

● with latest sharp › dev support w/o next.config.js › should maintain jpg format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  413 |     const opts = { headers: { accept } }
  414 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 415 |     expect(res.status).toBe(200)
      |                        ^
  416 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  417 |     expect(res.headers.get('Cache-Control')).toBe(
  418 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:415:24)

● with latest sharp › dev support w/o next.config.js › should maintain png format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  431 |     const opts = { headers: { accept } }
  432 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 433 |     expect(res.status).toBe(200)
      |                        ^
  434 |     expect(res.headers.get('Content-Type')).toContain('image/png')
  435 |     expect(res.headers.get('Cache-Control')).toBe(
  436 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:433:24)

● with latest sharp › dev support w/o next.config.js › should downlevel webp format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  449 |     const opts = { headers: { accept } }
  450 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 451 |     expect(res.status).toBe(200)
      |                        ^
  452 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  453 |     expect(res.headers.get('Cache-Control')).toBe(
  454 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:451:24)

● with latest sharp › dev support w/o next.config.js › should downlevel avif format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  468 |     const opts = { headers: { accept } }
  469 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 470 |     expect(res.status).toBe(200)
      |                        ^
  471 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  472 |     expect(res.headers.get('Cache-Control')).toBe(
  473 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:470:24)

● with latest sharp › dev support w/o next.config.js › should resize relative url and webp Firefox accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  629 |     const opts = { headers: { accept: 'image/webp,*/*' } }
  630 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 631 |     expect(res.status).toBe(200)
      |                        ^
  632 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  633 |     expect(res.headers.get('Cache-Control')).toBe(
  634 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:631:24)

● with latest sharp › dev support w/o next.config.js › should resize relative url and png accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  646 |     const opts = { headers: { accept: 'image/png' } }
  647 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 648 |     expect(res.status).toBe(200)
      |                        ^
  649 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  650 |     expect(res.headers.get('Cache-Control')).toBe(
  651 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:648:24)

● with latest sharp › dev support w/o next.config.js › should resize relative url with invalid accept header as png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  663 |     const opts = { headers: { accept: 'image/invalid' } }
  664 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 665 |     expect(res.status).toBe(200)
      |                        ^
  666 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  667 |     expect(res.headers.get('Cache-Control')).toBe(
  668 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:665:24)

● with latest sharp › dev support w/o next.config.js › should resize relative url with invalid accept header as gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  680 |     const opts = { headers: { accept: 'image/invalid' } }
  681 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 682 |     expect(res.status).toBe(200)
      |                        ^
  683 |     expect(res.headers.get('Content-Type')).toBe('image/gif')
  684 |     expect(res.headers.get('Cache-Control')).toBe(
  685 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:682:24)

● with latest sharp › dev support w/o next.config.js › should resize relative url with invalid accept header as tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  697 |     const opts = { headers: { accept: 'image/invalid' } }
  698 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 699 |     expect(res.status).toBe(200)
      |                        ^
  700 |     expect(res.headers.get('Content-Type')).toBe('image/tiff')
  701 |     expect(res.headers.get('Cache-Control')).toBe(
  702 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:699:24)

● with latest sharp › dev support w/o next.config.js › should resize gif (not animated)

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  714 |     const opts = { headers: { accept: 'image/webp' } }
  715 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 716 |     expect(res.status).toBe(200)
      |                        ^
  717 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  718 |     expect(res.headers.get('Cache-Control')).toBe(
  719 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:716:24)

● with latest sharp › dev support w/o next.config.js › should resize tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  731 |     const opts = { headers: { accept: 'image/webp' } }
  732 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 733 |     expect(res.status).toBe(200)
      |                        ^
  734 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  735 |     expect(res.headers.get('Cache-Control')).toBe(
  736 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:733:24)

● with latest sharp › dev support w/o next.config.js › should resize avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  748 |     const opts = { headers: { accept: 'image/webp' } }
  749 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 750 |     expect(res.status).toBe(200)
      |                        ^
  751 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  752 |     expect(res.headers.get('Cache-Control')).toBe(
  753 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:750:24)

● with latest sharp › dev support w/o next.config.js › should resize relative url and old Chrome accept header as webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  767 |     }
  768 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 769 |     expect(res.status).toBe(200)
      |                        ^
  770 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  771 |     expect(res.headers.get('Cache-Control')).toBe(
  772 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:769:24)

● with latest sharp › dev support w/o next.config.js › should fail when internal url is not an image

expect(received).toBe(expected) // Object.is equality

Expected: "Unable to optimize image and unable to fallback to upstream image"
Received: "\"q\" parameter (quality) of 39 is not allowed"

  1076 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1077 |     expect(res.status).toBe(400)
> 1078 |     expect(await res.text()).toBe(
       |                              ^
  1079 |       `Unable to optimize image and unable to fallback to upstream image`
  1080 |     )
  1081 |   })

  at Object.toBe (integration/image-optimizer/test/util.ts:1078:30)

● with latest sharp › dev support w/o next.config.js › should use cache and stale-while-revalidate when query is the same for internal image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1115 |       opts
  1116 |     )
> 1117 |     expect(one.res.status).toBe(200)
       |                            ^
  1118 |     expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1119 |     expect(one.res.headers.get('Content-Type')).toBe('image/webp')
  1120 |     expect(one.res.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1117:28)

● with latest sharp › dev support w/o next.config.js › should use cached image file when parameters are the same for animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1250 |
  1251 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1252 |     expect(res1.status).toBe(200)
       |                         ^
  1253 |     expect(res1.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1254 |     expect(res1.headers.get('Content-Type')).toBe('image/gif')
  1255 |     expect(res1.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1252:25)

● with latest sharp › dev support w/o next.config.js › should set 304 status without body when etag matches if-none-match

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1279 |
  1280 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts1)
> 1281 |     expect(res1.status).toBe(200)
       |                         ^
  1282 |     expect(res1.headers.get('Content-Type')).toBe('image/webp')
  1283 |     expect(res1.headers.get('Cache-Control')).toBe(
  1284 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1281:25)

● with latest sharp › dev support w/o next.config.js › should maintain bmp

ENOENT: no such file or directory, scandir '/root/actions-runner/_work/next.js/next.js/test/integration/image-optimizer/app/.next/cache/images'

● with latest sharp › dev support w/o next.config.js › should not resize if requested width is larger than original source image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1354 |     const opts = { headers: { accept: 'image/webp' } }
  1355 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1356 |     expect(res.status).toBe(200)
       |                        ^
  1357 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  1358 |     expect(res.headers.get('Cache-Control')).toBe(
  1359 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1356:24)

● with latest sharp › dev support w/o next.config.js › should error if the resource isn't a valid image

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1407 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1408 |     expect(res.status).toBe(400)
> 1409 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1410 |   })
  1411 |
  1412 |   it('should error if the image file does not exist', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:1409:30)

● with latest sharp › dev support w/o next.config.js › should error if the image file does not exist

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1415 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1416 |     expect(res.status).toBe(400)
> 1417 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1418 |   })
  1419 |
  1420 |   if (domains.length > 0) {

  at Object.toBe (integration/image-optimizer/test/util.ts:1417:30)

● with latest sharp › dev support with next.config.js › should normalize invalid status codes

expect(received).toBe(expected) // Object.is equality

Expected: 500
Received: 400

  177 |
  178 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 179 |       expect(res.status).toBe(500)
      |                          ^
  180 |     })
  181 |
  182 |     it('should timeout for upstream image exceeding 7 seconds', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:179:26)

● with latest sharp › dev support with next.config.js › should timeout for upstream image exceeding 7 seconds

expect(received).toBe(expected) // Object.is equality

Expected: 504
Received: 400

  184 |       const query = { url, w: ctx.w, q: 100 }
  185 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 186 |       expect(res.status).toBe(504)
      |                          ^
  187 |     })
  188 |   }
  189 |

  at Object.toBe (integration/image-optimizer/test/util.ts:186:26)

● with latest sharp › dev support with next.config.js › should handle non-ascii characters in image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  196 |     const query = { w: ctx.w, q: 90, url: '/äöüščří.png' }
  197 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 198 |     expect(res.status).toBe(200)
      |                        ^
  199 |   })
  200 |
  201 |   it('should maintain icns', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:198:24)

● with latest sharp › dev support with next.config.js › should maintain icns

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  202 |     const query = { w: ctx.w, q: 90, url: '/test.icns' }
  203 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 204 |     expect(res.status).toBe(200)
      |                        ^
  205 |     expect(res.headers.get('Content-Type')).toContain('image/x-icns')
  206 |     expect(res.headers.get('Cache-Control')).toBe(
  207 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:204:24)

● with latest sharp › dev support with next.config.js › should maintain pic/pct

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  218 |     const query = { w: ctx.w, q: 90, url: '/test.pic' }
  219 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 220 |     expect(res.status).toBe(200)
      |                        ^
  221 |     expect(res.headers.get('Content-Type')).toContain('image/x-pict')
  222 |     expect(res.headers.get('Cache-Control')).toBe(
  223 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:220:24)

● with latest sharp › dev support with next.config.js › should maintain animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  239 |     const query = { w: ctx.w, q: 90, url: '/animated.gif' }
  240 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 241 |     expect(res.status).toBe(200)
      |                        ^
  242 |     expect(res.headers.get('content-type')).toContain('image/gif')
  243 |     expect(res.headers.get('Cache-Control')).toBe(
  244 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:241:24)

● with latest sharp › dev support with next.config.js › should maintain animated png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  256 |     const query = { w: ctx.w, q: 90, url: '/animated.png' }
  257 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 258 |     expect(res.status).toBe(200)
      |                        ^
  259 |     expect(res.headers.get('content-type')).toContain('image/png')
  260 |     expect(res.headers.get('Cache-Control')).toBe(
  261 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:258:24)

● with latest sharp › dev support with next.config.js › should maintain animated png 2

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  273 |     const query = { w: ctx.w, q: 90, url: '/animated2.png' }
  274 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 275 |     expect(res.status).toBe(200)
      |                        ^
  276 |     expect(res.headers.get('content-type')).toContain('image/png')
  277 |     expect(res.headers.get('Cache-Control')).toBe(
  278 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:275:24)

● with latest sharp › dev support with next.config.js › should maintain animated webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  290 |     const query = { w: ctx.w, q: 90, url: '/animated.webp' }
  291 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 292 |     expect(res.status).toBe(200)
      |                        ^
  293 |     expect(res.headers.get('content-type')).toContain('image/webp')
  294 |     expect(res.headers.get('Cache-Control')).toBe(
  295 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:292:24)

● with latest sharp › dev support with next.config.js › should not allow vector svg

expect(received).toContain(expected) // indexOf

Expected substring: "valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 35 is not allowed"

  341 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  342 |       expect(res.status).toBe(400)
> 343 |       expect(await res.text()).toContain('valid but image type is not allowed')
      |                                ^
  344 |     })
  345 |
  346 |     it('should not allow svg with application header', async () => {

  at Object.toContain (integration/image-optimizer/test/util.ts:343:32)

● with latest sharp › dev support with next.config.js › should not allow svg with application header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 45 is not allowed"

  349 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  350 |       expect(res.status).toBe(400)
> 351 |       expect(await res.text()).toContain(
      |                                ^
  352 |         "The requested resource isn't a valid image"
  353 |       )
  354 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:351:32)

● with latest sharp › dev support with next.config.js › should not allow svg with comma header

expect(received).toContain(expected) // indexOf

Expected substring: "The requested resource isn't a valid image"
Received string:    "\"q\" parameter (quality) of 55 is not allowed"

  359 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  360 |       expect(res.status).toBe(400)
> 361 |       expect(await res.text()).toContain(
      |                                ^
  362 |         "The requested resource isn't a valid image"
  363 |       )
  364 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:361:32)

● with latest sharp › dev support with next.config.js › should not allow svg with uppercase header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  369 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  370 |       expect(res.status).toBe(400)
> 371 |       expect(await res.text()).toContain(
      |                                ^
  372 |         '"url" parameter is valid but image type is not allowed'
  373 |       )
  374 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:371:32)

● with latest sharp › dev support with next.config.js › should not allow svg with wrong header

expect(received).toContain(expected) // indexOf

Expected substring: "\"url\" parameter is valid but image type is not allowed"
Received string:    "\"q\" parameter (quality) of 65 is not allowed"

  379 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  380 |       expect(res.status).toBe(400)
> 381 |       expect(await res.text()).toContain(
      |                                ^
  382 |         '"url" parameter is valid but image type is not allowed'
  383 |       )
  384 |     })

  at Object.toContain (integration/image-optimizer/test/util.ts:381:32)

● with latest sharp › dev support with next.config.js › should maintain ico format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  389 |     const opts = { headers: { accept: 'image/webp' } }
  390 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 391 |     expect(res.status).toBe(200)
      |                        ^
  392 |     expect(res.headers.get('Content-Type')).toContain('image/x-icon')
  393 |     expect(res.headers.get('Cache-Control')).toBe(
  394 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:391:24)

● with latest sharp › dev support with next.config.js › should maintain jpg format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  413 |     const opts = { headers: { accept } }
  414 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 415 |     expect(res.status).toBe(200)
      |                        ^
  416 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  417 |     expect(res.headers.get('Cache-Control')).toBe(
  418 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:415:24)

● with latest sharp › dev support with next.config.js › should maintain png format for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  431 |     const opts = { headers: { accept } }
  432 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 433 |     expect(res.status).toBe(200)
      |                        ^
  434 |     expect(res.headers.get('Content-Type')).toContain('image/png')
  435 |     expect(res.headers.get('Cache-Control')).toBe(
  436 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:433:24)

● with latest sharp › dev support with next.config.js › should downlevel webp format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  449 |     const opts = { headers: { accept } }
  450 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 451 |     expect(res.status).toBe(200)
      |                        ^
  452 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  453 |     expect(res.headers.get('Cache-Control')).toBe(
  454 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:451:24)

● with latest sharp › dev support with next.config.js › should downlevel avif format to jpeg for old Safari

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  468 |     const opts = { headers: { accept } }
  469 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 470 |     expect(res.status).toBe(200)
      |                        ^
  471 |     expect(res.headers.get('Content-Type')).toContain('image/jpeg')
  472 |     expect(res.headers.get('Cache-Control')).toBe(
  473 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:470:24)

● with latest sharp › dev support with next.config.js › should resize relative url and webp Firefox accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  629 |     const opts = { headers: { accept: 'image/webp,*/*' } }
  630 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 631 |     expect(res.status).toBe(200)
      |                        ^
  632 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  633 |     expect(res.headers.get('Cache-Control')).toBe(
  634 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:631:24)

● with latest sharp › dev support with next.config.js › should resize relative url and png accept header

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  646 |     const opts = { headers: { accept: 'image/png' } }
  647 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 648 |     expect(res.status).toBe(200)
      |                        ^
  649 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  650 |     expect(res.headers.get('Cache-Control')).toBe(
  651 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:648:24)

● with latest sharp › dev support with next.config.js › should resize relative url with invalid accept header as png

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  663 |     const opts = { headers: { accept: 'image/invalid' } }
  664 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 665 |     expect(res.status).toBe(200)
      |                        ^
  666 |     expect(res.headers.get('Content-Type')).toBe('image/png')
  667 |     expect(res.headers.get('Cache-Control')).toBe(
  668 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:665:24)

● with latest sharp › dev support with next.config.js › should resize relative url with invalid accept header as gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  680 |     const opts = { headers: { accept: 'image/invalid' } }
  681 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 682 |     expect(res.status).toBe(200)
      |                        ^
  683 |     expect(res.headers.get('Content-Type')).toBe('image/gif')
  684 |     expect(res.headers.get('Cache-Control')).toBe(
  685 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:682:24)

● with latest sharp › dev support with next.config.js › should resize relative url with invalid accept header as tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  697 |     const opts = { headers: { accept: 'image/invalid' } }
  698 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 699 |     expect(res.status).toBe(200)
      |                        ^
  700 |     expect(res.headers.get('Content-Type')).toBe('image/tiff')
  701 |     expect(res.headers.get('Cache-Control')).toBe(
  702 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:699:24)

● with latest sharp › dev support with next.config.js › should resize gif (not animated)

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  714 |     const opts = { headers: { accept: 'image/webp' } }
  715 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 716 |     expect(res.status).toBe(200)
      |                        ^
  717 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  718 |     expect(res.headers.get('Cache-Control')).toBe(
  719 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:716:24)

● with latest sharp › dev support with next.config.js › should resize tiff

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  731 |     const opts = { headers: { accept: 'image/webp' } }
  732 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 733 |     expect(res.status).toBe(200)
      |                        ^
  734 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  735 |     expect(res.headers.get('Cache-Control')).toBe(
  736 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:733:24)

● with latest sharp › dev support with next.config.js › should resize avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  748 |     const opts = { headers: { accept: 'image/webp' } }
  749 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 750 |     expect(res.status).toBe(200)
      |                        ^
  751 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  752 |     expect(res.headers.get('Cache-Control')).toBe(
  753 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:750:24)

● with latest sharp › dev support with next.config.js › should resize relative url and old Chrome accept header as webp

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  767 |     }
  768 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 769 |     expect(res.status).toBe(200)
      |                        ^
  770 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  771 |     expect(res.headers.get('Cache-Control')).toBe(
  772 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:769:24)

● with latest sharp › dev support with next.config.js › should resize relative url and new Chrome accept header as avif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  789 |       }
  790 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 791 |       expect(res.status).toBe(200)
      |                          ^
  792 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  793 |       expect(res.headers.get('Cache-Control')).toBe(
  794 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:791:26)

● with latest sharp › dev support with next.config.js › should resize avif and maintain format

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  806 |       const opts = { headers: { accept: 'image/avif' } }
  807 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 808 |       expect(res.status).toBe(200)
      |                          ^
  809 |       expect(res.headers.get('Content-Type')).toBe('image/avif')
  810 |       expect(res.headers.get('Cache-Control')).toBe(
  811 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:808:26)

● with latest sharp › dev support with next.config.js › should compress avif smaller than webp at q=100

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:822:7)

● with latest sharp › dev support with next.config.js › should compress avif smaller than webp at q=75

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:826:7)

● with latest sharp › dev support with next.config.js › should compress avif smaller than webp at q=50

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  109 |     },
  110 |   })
> 111 |   expect(res1.status).toBe(200)
      |                       ^
  112 |   expect(res1.headers.get('Content-Type')).toBe('image/avif')
  113 |
  114 |   const res2 = await fetchViaHTTP(appPort, '/_next/image', query, {

  at toBe (integration/image-optimizer/test/util.ts:111:23)
  at Object.<anonymous> (integration/image-optimizer/test/util.ts:830:7)

● with latest sharp › dev support with next.config.js › should resize absolute url from localhost

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  838 |       const opts = { headers: { accept: 'image/webp' } }
  839 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 840 |       expect(res.status).toBe(200)
      |                          ^
  841 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  842 |       expect(res.headers.get('Cache-Control')).toBe(
  843 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:840:26)

● with latest sharp › dev support with next.config.js › should automatically detect image type when content-type is octet-stream

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  861 |       const opts = { headers: { accept: 'image/webp' } }
  862 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 863 |       expect(res.status).toBe(200)
      |                          ^
  864 |       expect(res.headers.get('Content-Type')).toBe('image/webp')
  865 |       expect(res.headers.get('Cache-Control')).toBe(
  866 |         `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:863:26)

● with latest sharp › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for external image

expect(received).toBeGreaterThan(expected)

Expected: > 500
Received:   3

  894 |         opts
  895 |       )
> 896 |       expect(one.duration).toBeGreaterThan(delay)
      |                            ^
  897 |       expect(one.res.status).toBe(200)
  898 |       expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  899 |       expect(one.res.headers.get('Content-Type')).toBe('image/webp')

  at Object.toBeGreaterThan (integration/image-optimizer/test/util.ts:896:28)

● with latest sharp › dev support with next.config.js › recursive url is not allowed › should pass with absolute next image url

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1047 |         const query = { url: fullUrl, w: ctx.w, q: 1 }
  1048 |         const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1049 |         expect(res.status).toBe(200)
       |                            ^
  1050 |         await expectWidth(res, ctx.w)
  1051 |       })
  1052 |     } else {

  at Object.toBe (integration/image-optimizer/test/util.ts:1049:28)

● with latest sharp › dev support with next.config.js › should fail when internal url is not an image

expect(received).toBe(expected) // Object.is equality

Expected: "Unable to optimize image and unable to fallback to upstream image"
Received: "\"q\" parameter (quality) of 39 is not allowed"

  1076 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1077 |     expect(res.status).toBe(400)
> 1078 |     expect(await res.text()).toBe(
       |                              ^
  1079 |       `Unable to optimize image and unable to fallback to upstream image`
  1080 |     )
  1081 |   })

  at Object.toBe (integration/image-optimizer/test/util.ts:1078:30)

● with latest sharp › dev support with next.config.js › should fail when url fails to load an image

expect(received).toBe(expected) // Object.is equality

Expected: 404
Received: 400

  1086 |       const query = { w: ctx.w, url, q: 100 }
  1087 |       const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, {})
> 1088 |       expect(res.status).toBe(404)
       |                          ^
  1089 |       expect(await res.text()).toBe(
  1090 |         `"url" parameter is valid but upstream response is invalid`
  1091 |       )

  at Object.toBe (integration/image-optimizer/test/util.ts:1088:26)

● with latest sharp › dev support with next.config.js › should use cache and stale-while-revalidate when query is the same for internal image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1115 |       opts
  1116 |     )
> 1117 |     expect(one.res.status).toBe(200)
       |                            ^
  1118 |     expect(one.res.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1119 |     expect(one.res.headers.get('Content-Type')).toBe('image/webp')
  1120 |     expect(one.res.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1117:28)

● with latest sharp › dev support with next.config.js › should use cached image file when parameters are the same for animated gif

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1250 |
  1251 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1252 |     expect(res1.status).toBe(200)
       |                         ^
  1253 |     expect(res1.headers.get('X-Nextjs-Cache')).toBe('MISS')
  1254 |     expect(res1.headers.get('Content-Type')).toBe('image/gif')
  1255 |     expect(res1.headers.get('Content-Disposition')).toBe(

  at Object.toBe (integration/image-optimizer/test/util.ts:1252:25)

● with latest sharp › dev support with next.config.js › should set 304 status without body when etag matches if-none-match

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1279 |
  1280 |     const res1 = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts1)
> 1281 |     expect(res1.status).toBe(200)
       |                         ^
  1282 |     expect(res1.headers.get('Content-Type')).toBe('image/webp')
  1283 |     expect(res1.headers.get('Cache-Control')).toBe(
  1284 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1281:25)

● with latest sharp › dev support with next.config.js › should maintain bmp

ENOENT: no such file or directory, scandir '/root/actions-runner/_work/next.js/next.js/test/integration/image-optimizer/app/.next/cache/images'

● with latest sharp › dev support with next.config.js › should not resize if requested width is larger than original source image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1354 |     const opts = { headers: { accept: 'image/webp' } }
  1355 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
> 1356 |     expect(res.status).toBe(200)
       |                        ^
  1357 |     expect(res.headers.get('Content-Type')).toBe('image/webp')
  1358 |     expect(res.headers.get('Cache-Control')).toBe(
  1359 |       `public, max-age=${isDev ? 0 : minimumCacheTTL}, must-revalidate`

  at Object.toBe (integration/image-optimizer/test/util.ts:1356:24)

● with latest sharp › dev support with next.config.js › should error if the resource isn't a valid image

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1407 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1408 |     expect(res.status).toBe(400)
> 1409 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1410 |   })
  1411 |
  1412 |   it('should error if the image file does not exist', async () => {

  at Object.toBe (integration/image-optimizer/test/util.ts:1409:30)

● with latest sharp › dev support with next.config.js › should error if the image file does not exist

expect(received).toBe(expected) // Object.is equality

Expected: "The requested resource isn't a valid image."
Received: "\"q\" parameter (quality) of 80 is not allowed"

  1415 |     const res = await fetchViaHTTP(ctx.appPort, '/_next/image', query, opts)
  1416 |     expect(res.status).toBe(400)
> 1417 |     expect(await res.text()).toBe("The requested resource isn't a valid image.")
       |                              ^
  1418 |   })
  1419 |
  1420 |   if (domains.length > 0) {

  at Object.toBe (integration/image-optimizer/test/util.ts:1417:30)

● with latest sharp › dev support with next.config.js › should handle concurrent requests

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  1438 |       }
  1439 |
> 1440 |       expect(res1.status).toBe(200)
       |                           ^
  1441 |       expect(res2.status).toBe(200)
  1442 |       expect(res3.status).toBe(200)
  1443 |

  at Object.toBe (integration/image-optimizer/test/util.ts:1440:27)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-legacy/base-path/test/static.test.ts

• Static Image Component Tests for basePath > development mode > Should use immutable cache-control header for static import
• Static Image Component Tests for basePath > production mode > Should use immutable cache-control header for static import

Expand output

● Static Image Component Tests for basePath › production mode › Should use immutable cache-control header for static import

expect(received).toBe(expected) // Object.is equality

Expected: "public, max-age=315360000, immutable"
Received: null

  42 |     )
  43 |     const res = await fetch(url)
> 44 |     expect(res.headers.get('cache-control')).toBe(
     |                                              ^
  45 |       'public, max-age=315360000, immutable'
  46 |     )
  47 |   })

  at Object.toBe (integration/next-image-legacy/base-path/test/static.test.ts:44:46)

● Static Image Component Tests for basePath › development mode › Should use immutable cache-control header for static import

expect(received).toBe(expected) // Object.is equality

Expected: "public, max-age=315360000, immutable"
Received: null

  42 |     )
  43 |     const res = await fetch(url)
> 44 |     expect(res.headers.get('cache-control')).toBe(
     |                                              ^
  45 |       'public, max-age=315360000, immutable'
  46 |     )
  47 |   })

  at Object.toBe (integration/next-image-legacy/base-path/test/static.test.ts:44:46)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-new/unicode/test/index.test.ts

• Image Component Unicode Image URL > development mode > should load static unicode image
• Image Component Unicode Image URL > development mode > should load internal unicode image
• Image Component Unicode Image URL > development mode > should load external unicode image
• Image Component Unicode Image URL > development mode > should load internal image with space
• Image Component Unicode Image URL > development mode > should load external image with space
• Image Component Unicode Image URL > production mode > should load static unicode image
• Image Component Unicode Image URL > production mode > should load internal unicode image
• Image Component Unicode Image URL > production mode > should load external unicode image
• Image Component Unicode Image URL > production mode > should load internal image with space
• Image Component Unicode Image URL > production mode > should load external image with space

Expand output

● Image Component Unicode Image URL › development mode › should load static unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  26 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  27 |     const res = await fetch(fullSrc)
> 28 |     expect(res.status).toBe(200)
     |                        ^
  29 |   })
  30 |
  31 |   it('should load internal unicode image', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:28:24)

● Image Component Unicode Image URL › development mode › should load internal unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  36 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  37 |     const res = await fetch(fullSrc)
> 38 |     expect(res.status).toBe(200)
     |                        ^
  39 |   })
  40 |
  41 |   it('should load external unicode image', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:38:24)

● Image Component Unicode Image URL › development mode › should load external unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  46 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  47 |     const res = await fetch(fullSrc)
> 48 |     expect(res.status).toBe(200)
     |                        ^
  49 |   })
  50 |
  51 |   it('should load internal image with space', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:48:24)

● Image Component Unicode Image URL › development mode › should load internal image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  54 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  55 |     const res = await fetch(fullSrc)
> 56 |     expect(res.status).toBe(200)
     |                        ^
  57 |   })
  58 |
  59 |   it('should load external image with space', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:56:24)

● Image Component Unicode Image URL › development mode › should load external image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  64 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  65 |     const res = await fetch(fullSrc)
> 66 |     expect(res.status).toBe(200)
     |                        ^
  67 |   })
  68 | }
  69 |

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:66:24)

● Image Component Unicode Image URL › production mode › should load static unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  26 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  27 |     const res = await fetch(fullSrc)
> 28 |     expect(res.status).toBe(200)
     |                        ^
  29 |   })
  30 |
  31 |   it('should load internal unicode image', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:28:24)

● Image Component Unicode Image URL › production mode › should load internal unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  36 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  37 |     const res = await fetch(fullSrc)
> 38 |     expect(res.status).toBe(200)
     |                        ^
  39 |   })
  40 |
  41 |   it('should load external unicode image', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:38:24)

● Image Component Unicode Image URL › production mode › should load external unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  46 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  47 |     const res = await fetch(fullSrc)
> 48 |     expect(res.status).toBe(200)
     |                        ^
  49 |   })
  50 |
  51 |   it('should load internal image with space', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:48:24)

● Image Component Unicode Image URL › production mode › should load internal image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  54 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  55 |     const res = await fetch(fullSrc)
> 56 |     expect(res.status).toBe(200)
     |                        ^
  57 |   })
  58 |
  59 |   it('should load external image with space', async () => {

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:56:24)

● Image Component Unicode Image URL › production mode › should load external image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  64 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  65 |     const res = await fetch(fullSrc)
> 66 |     expect(res.status).toBe(200)
     |                        ^
  67 |   })
  68 | }
  69 |

  at Object.toBe (integration/next-image-new/unicode/test/index.test.ts:66:24)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-legacy/unicode/test/index.test.ts

• Image Component Unicode Image URL > development mode > should load static unicode image
• Image Component Unicode Image URL > development mode > should load internal unicode image
• Image Component Unicode Image URL > development mode > should load external unicode image
• Image Component Unicode Image URL > development mode > should load internal image with space
• Image Component Unicode Image URL > development mode > should load external image with space
• Image Component Unicode Image URL > production mode > should load static unicode image
• Image Component Unicode Image URL > production mode > should load internal unicode image
• Image Component Unicode Image URL > production mode > should load external unicode image
• Image Component Unicode Image URL > production mode > should load internal image with space
• Image Component Unicode Image URL > production mode > should load external image with space

Expand output

● Image Component Unicode Image URL › development mode › should load static unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  26 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  27 |     const res = await fetch(fullSrc)
> 28 |     expect(res.status).toBe(200)
     |                        ^
  29 |   })
  30 |
  31 |   it('should load internal unicode image', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:28:24)

● Image Component Unicode Image URL › development mode › should load internal unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  36 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  37 |     const res = await fetch(fullSrc)
> 38 |     expect(res.status).toBe(200)
     |                        ^
  39 |   })
  40 |
  41 |   it('should load external unicode image', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:38:24)

● Image Component Unicode Image URL › development mode › should load external unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  46 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  47 |     const res = await fetch(fullSrc)
> 48 |     expect(res.status).toBe(200)
     |                        ^
  49 |   })
  50 |
  51 |   it('should load internal image with space', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:48:24)

● Image Component Unicode Image URL › development mode › should load internal image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  54 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  55 |     const res = await fetch(fullSrc)
> 56 |     expect(res.status).toBe(200)
     |                        ^
  57 |   })
  58 |
  59 |   it('should load external image with space', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:56:24)

● Image Component Unicode Image URL › development mode › should load external image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  64 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  65 |     const res = await fetch(fullSrc)
> 66 |     expect(res.status).toBe(200)
     |                        ^
  67 |   })
  68 | }
  69 |

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:66:24)

● Image Component Unicode Image URL › production mode › should load static unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  26 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  27 |     const res = await fetch(fullSrc)
> 28 |     expect(res.status).toBe(200)
     |                        ^
  29 |   })
  30 |
  31 |   it('should load internal unicode image', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:28:24)

● Image Component Unicode Image URL › production mode › should load internal unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  36 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  37 |     const res = await fetch(fullSrc)
> 38 |     expect(res.status).toBe(200)
     |                        ^
  39 |   })
  40 |
  41 |   it('should load external unicode image', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:38:24)

● Image Component Unicode Image URL › production mode › should load external unicode image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  46 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  47 |     const res = await fetch(fullSrc)
> 48 |     expect(res.status).toBe(200)
     |                        ^
  49 |   })
  50 |
  51 |   it('should load internal image with space', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:48:24)

● Image Component Unicode Image URL › production mode › should load internal image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  54 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  55 |     const res = await fetch(fullSrc)
> 56 |     expect(res.status).toBe(200)
     |                        ^
  57 |   })
  58 |
  59 |   it('should load external image with space', async () => {

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:56:24)

● Image Component Unicode Image URL › production mode › should load external image with space

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  64 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  65 |     const res = await fetch(fullSrc)
> 66 |     expect(res.status).toBe(200)
     |                        ^
  67 |   })
  68 | }
  69 |

  at Object.toBe (integration/next-image-legacy/unicode/test/index.test.ts:66:24)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-legacy/default/test/static.test.ts

• Static Image Component Tests > production mode > Should use immutable cache-control header for static import
• Static Image Component Tests > production mode > should load direct imported image
• Static Image Component Tests > production mode > should load staticprops imported image

Expand output

● Static Image Component Tests › production mode › Should use immutable cache-control header for static import

expect(received).toBe(expected) // Object.is equality

Expected: "public, max-age=315360000, immutable"
Received: null

  42 |     )
  43 |     const res = await fetch(url)
> 44 |     expect(res.headers.get('cache-control')).toBe(
     |                                              ^
  45 |       'public, max-age=315360000, immutable'
  46 |     )
  47 |   })

  at Object.toBe (integration/next-image-legacy/default/test/static.test.ts:44:46)

● Static Image Component Tests › production mode › should load direct imported image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

   98 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
   99 |     const res = await fetch(fullSrc)
> 100 |     expect(res.status).toBe(200)
      |                        ^
  101 |   })
  102 |
  103 |   it('should load staticprops imported image', async () => {

  at Object.toBe (integration/next-image-legacy/default/test/static.test.ts:100:24)

● Static Image Component Tests › production mode › should load staticprops imported image

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  110 |     const fullSrc = new URL(src, `http://localhost:${appPort}`)
  111 |     const res = await fetch(fullSrc)
> 112 |     expect(res.status).toBe(200)
      |                        ^
  113 |   })
  114 | }
  115 |

  at Object.toBe (integration/next-image-legacy/default/test/static.test.ts:112:24)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-new/app-dir-localpatterns/test/index.test.ts (turbopack)

• Image localPatterns config > production mode > should load matching images

Expand output

● Image localPatterns config › production mode › should load matching images

expect(received).toStrictEqual(expected) // deep equality

- Expected  - 2
+ Received  + 2

  Array [
-   200,
-   200,
+   400,
+   400,
  ]

  44 |     )
  45 |     const statuses = responses.map((res) => res.status)
> 46 |     expect(statuses).toStrictEqual([200, 200])
     |                      ^
  47 |   })
  48 |
  49 |   it.each([

  at Object.toStrictEqual (integration/next-image-new/app-dir-localpatterns/test/index.test.ts:46:22)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-new/loader-config-default-loader-with-file/test/index.test.ts

• Image Loader Config > development mode - component > should work with loaderFile config, leaving default image optimization enabled
• Image Loader Config > development mode - getImageProps > should work with loaderFile config, leaving default image optimization enabled
• Image Loader Config > production mode - component > should work with loaderFile config, leaving default image optimization enabled
• Image Loader Config > production mode - getImageProps > should work with loaderFile config, leaving default image optimization enabled

Expand output

● Image Loader Config › development mode - component › should work with loaderFile config, leaving default image optimization enabled

expect(received).toBe(expected) // Object.is equality

Expected: true
Received: false

  31 |         `document.getElementById('img1').complete && document.getElementById('img1').naturalWidth !== 0`
  32 |       )
> 33 |     ).toBe(true)
     |       ^
  34 |   })
  35 |
  36 |   it('should work with loader prop', async () => {

  at Object.toBe (integration/next-image-new/loader-config-default-loader-with-file/test/index.test.ts:33:7)

● Image Loader Config › production mode - component › should work with loaderFile config, leaving default image optimization enabled

expect(received).toBe(expected) // Object.is equality

Expected: true
Received: false

  31 |         `document.getElementById('img1').complete && document.getElementById('img1').naturalWidth !== 0`
  32 |       )
> 33 |     ).toBe(true)
     |       ^
  34 |   })
  35 |
  36 |   it('should work with loader prop', async () => {

  at Object.toBe (integration/next-image-new/loader-config-default-loader-with-file/test/index.test.ts:33:7)

● Image Loader Config › development mode - getImageProps › should work with loaderFile config, leaving default image optimization enabled

expect(received).toBe(expected) // Object.is equality

Expected: true
Received: false

  31 |         `document.getElementById('img1').complete && document.getElementById('img1').naturalWidth !== 0`
  32 |       )
> 33 |     ).toBe(true)
     |       ^
  34 |   })
  35 |
  36 |   it('should work with loader prop', async () => {

  at Object.toBe (integration/next-image-new/loader-config-default-loader-with-file/test/index.test.ts:33:7)

● Image Loader Config › production mode - getImageProps › should work with loaderFile config, leaving default image optimization enabled

expect(received).toBe(expected) // Object.is equality

Expected: true
Received: false

  31 |         `document.getElementById('img1').complete && document.getElementById('img1').naturalWidth !== 0`
  32 |       )
> 33 |     ).toBe(true)
     |       ^
  34 |   })
  35 |
  36 |   it('should work with loader prop', async () => {

  at Object.toBe (integration/next-image-new/loader-config-default-loader-with-file/test/index.test.ts:33:7)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/e2e/app-dir/next-image/next-image.test.ts (PPR)

• app dir - next-image > image content > should render images on / route
• app dir - next-image > image content > should render images on /client route
• app dir - next-image > image content > should render images nested under page dir on /nested route
• app dir - next-image > image content > should render legacy images under /legacy route
• app dir - next-image > image content > should render legacy images in edge runtime on /legacy-edge-runtime route

Expand output

● app dir - next-image › image content › should render images on / route

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  268 |
  269 |       const res1 = await next.fetch($('#app-layout').attr('src'))
> 270 |       expect(res1.status).toBe(200)
      |                           ^
  271 |       expect(res1.headers.get('content-type')).toBe('image/png')
  272 |
  273 |       const res2 = await next.fetch($('#app-page').attr('src'))

  at Object.toBe (e2e/app-dir/next-image/next-image.test.ts:270:27)

● app dir - next-image › image content › should render images on /client route

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  284 |
  285 |       const res1 = await next.fetch($('#app-layout').attr('src'))
> 286 |       expect(res1.status).toBe(200)
      |                           ^
  287 |       expect(res1.headers.get('content-type')).toBe('image/png')
  288 |
  289 |       const res2 = await next.fetch($('#app-client-layout').attr('src'))

  at Object.toBe (e2e/app-dir/next-image/next-image.test.ts:286:27)

● app dir - next-image › image content › should render images nested under page dir on /nested route

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  304 |
  305 |       const res1 = await next.fetch($('#app-layout').attr('src'))
> 306 |       expect(res1.status).toBe(200)
      |                           ^
  307 |       expect(res1.headers.get('content-type')).toBe('image/png')
  308 |
  309 |       const res2 = await next.fetch($('#app-nested-layout').attr('src'))

  at Object.toBe (e2e/app-dir/next-image/next-image.test.ts:306:27)

● app dir - next-image › image content › should render legacy images under /legacy route

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  324 |
  325 |       const res2 = await next.fetch($('#app-legacy-layout').attr('src'))
> 326 |       expect(res2.status).toBe(200)
      |                           ^
  327 |       expect(res2.headers.get('content-type')).toBe('image/png')
  328 |
  329 |       const res3 = await next.fetch($('#app-legacy-page').attr('src'))

  at Object.toBe (e2e/app-dir/next-image/next-image.test.ts:326:27)

● app dir - next-image › image content › should render legacy images in edge runtime on /legacy-edge-runtime route

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  336 |
  337 |       const res2 = await next.fetch($('#app-legacy-edge-layout').attr('src'))
> 338 |       expect(res2.status).toBe(200)
      |                           ^
  339 |       expect(res2.headers.get('content-type')).toBe('image/png')
  340 |
  341 |       const res3 = await next.fetch($('#app-legacy-edge-page').attr('src'))

  at Object.toBe (e2e/app-dir/next-image/next-image.test.ts:338:27)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/e2e/app-dir/next-image/next-image-proxy.test.ts (PPR)

• next-image-proxy > loads images without any errors
• next-image-proxy > should work with connection upgrade by removing it via filterReqHeaders()

Expand output

● next-image-proxy › loads images without any errors

TIMED OUT: {"fulfilledCount":4,"failCount":0}

{"fulfilledCount":4,"failCount":4}

undefined

  731 |
  732 |   if (hardError) {
> 733 |     throw new Error('TIMED OUT: ' + regex + '\n\n' + content + '\n\n' + lastErr)
      |           ^
  734 |   }
  735 |   return false
  736 | }

  at check (lib/next-test-utils.ts:733:11)
  at Object.<anonymous> (e2e/app-dir/next-image/next-image-proxy.test.ts:105:5)

● next-image-proxy › should work with connection upgrade by removing it via filterReqHeaders()

expect(received).toBe(expected) // Object.is equality

Expected: 200
Received: 400

  112 |     const opts = { headers: { connection: 'upgrade' } }
  113 |     const res1 = await next.fetch(url1, opts)
> 114 |     expect(res1.status).toBe(200)
      |                         ^
  115 |     const url2 = $('#remote-app-page').attr('src')
  116 |     const res2 = await next.fetch(url2, opts)
  117 |     expect(res2.status).toBe(200)

  at Object.toBe (e2e/app-dir/next-image/next-image-proxy.test.ts:114:25)

Read more about building and testing Next.js in contributing.md.

pnpm test test/integration/next-image-new/base-path/test/index.test.js (turbopack)

• Image Component basePath Tests > development mode > should load the images
• Image Component basePath Tests > development mode > should correctly ignore prose styles

Expand output

● Image Component basePath Tests › development mode › should load the images

TIMED OUT: /result-correct/

undefined

Error: Incorrectly loaded image

  731 |
  732 |   if (hardError) {
> 733 |     throw new Error('TIMED OUT: ' + regex + '\n\n' + content + '\n\n' + lastErr)
      |           ^
  734 |   }
  735 |   return false
  736 | }

  at check (lib/next-test-utils.ts:733:11)
  at Object.<anonymous> (integration/next-image-new/base-path/test/index.test.js:61:7)

● Image Component basePath Tests › development mode › should correctly ignore prose styles

TIMED OUT: /result-correct/

undefined

Error: Image not ready

  731 |
  732 |   if (hardError) {
> 733 |     throw new Error('TIMED OUT: ' + regex + '\n\n' + content + '\n\n' + lastErr)
      |           ^
  734 |   }
  735 |   return false
  736 | }

  at check (lib/next-test-utils.ts:733:11)
  at Object.<anonymous> (integration/next-image-new/base-path/test/index.test.js:171:7)

Read more about building and testing Next.js in contributing.md.

pnpm test-start test/production/pages-dir/production/test/index.test.ts

• Production Usage > With Security Related Issues > should not execute script embedded inside svg image, even if dangerouslyAllowSVG=true

Expand output

● Production Usage › With Security Related Issues › should not execute script embedded inside svg image, even if dangerouslyAllowSVG=true

page.waitForSelector: Timeout 60000ms exceeded.
Call log:
  - waiting for locator('#msg')

  423 |     return this.chain(() => {
  424 |       return page
> 425 |         .waitForSelector(selector, { timeout, state: 'attached' })
      |          ^
  426 |         .then(async (el) => {
  427 |           // it seems selenium waits longer and tests rely on this behavior
  428 |           // so we wait for the load event fire before returning

  at waitForSelector (lib/browsers/playwright.ts:425:10)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/e2e/opentelemetry/client-trace-metadata/client-trace-metadata.test.ts (PPR)

• clientTraceMetadata > app router > should inject propagation data for a dynamically server-side-rendered page
• clientTraceMetadata > app router > hard loading a dynamic page twice should yield different dynamic trace data
• clientTraceMetadata > app router > should only insert the client trace metadata once
• clientTraceMetadata > app router > next dev only > should inject propagation data for a statically server-side-rendered page
• clientTraceMetadata > app router > next dev only > soft navigating to a dynamic page should not transform previous propagation data
• clientTraceMetadata > app router > next dev only > soft navigating to a static page should not transform previous propagation data
• clientTraceMetadata > pages router > should inject propagation data for a dynamically server-side-rendered page
• clientTraceMetadata > pages router > hard loading a dynamic page twice should yield different dynamic trace data
• clientTraceMetadata > pages router > next dev only > should inject propagation data for a statically server-side-rendered page
• clientTraceMetadata > pages router > next dev only > soft navigating to a dynamic page should not transform previous propagation data
• clientTraceMetadata > pages router > next dev only > soft navigating to a static page should not transform previous propagation data

Expand output

● clientTraceMetadata › app router › should inject propagation data for a dynamically server-side-rendered page

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › app router › hard loading a dynamic page twice should yield different dynamic trace data

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › app router › should only insert the client trace metadata once

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › app router › next dev only › should inject propagation data for a statically server-side-rendered page

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › app router › next dev only › soft navigating to a dynamic page should not transform previous propagation data

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › app router › next dev only › soft navigating to a static page should not transform previous propagation data

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › pages router › should inject propagation data for a dynamically server-side-rendered page

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › pages router › hard loading a dynamic page twice should yield different dynamic trace data

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › pages router › next dev only › should inject propagation data for a statically server-side-rendered page

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › pages router › next dev only › soft navigating to a dynamic page should not transform previous propagation data

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

● clientTraceMetadata › pages router › next dev only › soft navigating to a static page should not transform previous propagation data

Failed to start server after 10000ms, waiting for this log pattern: / ✓ Ready in /

  349 |     return setTimeout(() => {
  350 |       reject(
> 351 |         new Error(
      |         ^
  352 |           `Failed to start server after ${ms}ms, waiting for this log pattern: ${this.serverReadyPattern}`
  353 |         )
  354 |       )

  at Timeout._onTimeout (lib/next-modes/base.ts:351:9)

Read more about building and testing Next.js in contributing.md.

[ijjk]

Stats from current PR

Default Build

General Overall increase ⚠️

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
buildDuration	18.6s	15.9s	N/A
buildDurationCached	15s	12.4s	N/A
nodeModulesSize	416 MB	416 MB	⚠️ +13.3 kB
nextStartRea..uration (ms)	465ms	479ms	N/A

Client Bundles (main, webpack)

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
1187-HASH.js gzip	52.4 kB	52.4 kB	N/A
8276.HASH.js gzip	169 B	168 B	N/A
8377-HASH.js gzip	5.36 kB	5.39 kB	N/A
bccd1874-HASH.js gzip	52.8 kB	52.8 kB	N/A
framework-HASH.js gzip	57.5 kB	57.5 kB	N/A
main-app-HASH.js gzip	232 B	235 B	N/A
main-HASH.js gzip	34.1 kB	34.1 kB	N/A
webpack-HASH.js gzip	1.71 kB	1.71 kB	N/A
Overall change	0 B	0 B	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
polyfills-HASH.js gzip	39.4 kB	39.4 kB	✓
Overall change	39.4 kB	39.4 kB	✓

Client Pages

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
_app-HASH.js gzip	193 B	193 B	✓
_error-HASH.js gzip	193 B	193 B	✓
amp-HASH.js gzip	512 B	510 B	N/A
css-HASH.js gzip	343 B	342 B	N/A
dynamic-HASH.js gzip	1.84 kB	1.84 kB	✓
edge-ssr-HASH.js gzip	265 B	265 B	✓
head-HASH.js gzip	363 B	362 B	N/A
hooks-HASH.js gzip	393 B	392 B	N/A
image-HASH.js gzip	4.49 kB	4.51 kB	N/A
index-HASH.js gzip	268 B	268 B	✓
link-HASH.js gzip	2.35 kB	2.34 kB	N/A
routerDirect..HASH.js gzip	328 B	328 B	✓
script-HASH.js gzip	397 B	397 B	✓
withRouter-HASH.js gzip	323 B	326 B	N/A
1afbb74e6ecf..834.css gzip	106 B	106 B	✓
Overall change	3.59 kB	3.59 kB	✓

Client Build Manifests

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
_buildManifest.js gzip	749 B	745 B	N/A
Overall change	0 B	0 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
index.html gzip	523 B	524 B	N/A
link.html gzip	538 B	538 B	✓
withRouter.html gzip	519 B	521 B	N/A
Overall change	538 B	538 B	✓

Edge SSR bundle Size

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
edge-ssr.js gzip	128 kB	128 kB	N/A
page.js gzip	206 kB	206 kB	N/A
Overall change	0 B	0 B	✓

Middleware size

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
middleware-b..fest.js gzip	668 B	666 B	N/A
middleware-r..fest.js gzip	155 B	156 B	N/A
middleware.js gzip	31.2 kB	31.2 kB	N/A
edge-runtime..pack.js gzip	844 B	844 B	✓
Overall change	844 B	844 B	✓

Next Runtimes

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
274-experime...dev.js gzip	322 B	322 B	✓
274.runtime.dev.js gzip	314 B	314 B	✓
app-page-exp...dev.js gzip	359 kB	359 kB	N/A
app-page-exp..prod.js gzip	129 kB	129 kB	N/A
app-page-tur..prod.js gzip	142 kB	142 kB	N/A
app-page-tur..prod.js gzip	137 kB	137 kB	N/A
app-page.run...dev.js gzip	347 kB	347 kB	N/A
app-page.run..prod.js gzip	125 kB	125 kB	N/A
app-route-ex...dev.js gzip	37.5 kB	37.5 kB	✓
app-route-ex..prod.js gzip	25.5 kB	25.5 kB	✓
app-route-tu..prod.js gzip	25.5 kB	25.5 kB	✓
app-route-tu..prod.js gzip	25.4 kB	25.4 kB	✓
app-route.ru...dev.js gzip	39.2 kB	39.2 kB	✓
app-route.ru..prod.js gzip	25.4 kB	25.4 kB	✓
pages-api-tu..prod.js gzip	9.69 kB	9.69 kB	✓
pages-api.ru...dev.js gzip	11.6 kB	11.6 kB	✓
pages-api.ru..prod.js gzip	9.68 kB	9.68 kB	✓
pages-turbo...prod.js gzip	21.7 kB	21.7 kB	N/A
pages.runtim...dev.js gzip	27.5 kB	27.5 kB	N/A
pages.runtim..prod.js gzip	21.7 kB	21.7 kB	N/A
server.runti..prod.js gzip	916 kB	916 kB	✓
Overall change	1.13 MB	1.13 MB	✓

build cache

	vercel/next.js canary	vercel/next.js styfle/add-qualities	Change
0.pack gzip	2.08 MB	2.08 MB	N/A
index.pack gzip	73.9 kB	73.8 kB	N/A
Overall change	0 B	0 B	✓

Diff details

Diff for edge-ssr.js

Diff too large to display

Diff for image-HASH.js

@@ -1,7 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [2983],
   {
-    /***/ 3705: /***/ (
+    /***/ 8255: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -9,7 +9,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/image",
         function () {
-          return __webpack_require__(8448);
+          return __webpack_require__(8926);
         },
       ]);
       if (false) {
@@ -18,7 +18,7 @@
       /***/
     },
 
-    /***/ 7342: /***/ (module, exports, __webpack_require__) => {
+    /***/ 4369: /***/ (module, exports, __webpack_require__) => {
       "use strict";
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
@@ -40,17 +40,17 @@
         __webpack_require__(6049)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(7196)
+        __webpack_require__(956)
       );
-      const _getimgprops = __webpack_require__(2661);
-      const _imageconfig = __webpack_require__(72);
-      const _imageconfigcontextsharedruntime = __webpack_require__(6386);
-      const _warnonce = __webpack_require__(4496);
-      const _routercontextsharedruntime = __webpack_require__(6443);
+      const _getimgprops = __webpack_require__(485);
+      const _imageconfig = __webpack_require__(4664);
+      const _imageconfigcontextsharedruntime = __webpack_require__(1250);
+      const _warnonce = __webpack_require__(1648);
+      const _routercontextsharedruntime = __webpack_require__(907);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(3433)
+        __webpack_require__(6489)
       );
-      const _usemergedref = __webpack_require__(1942);
+      const _usemergedref = __webpack_require__(5942);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -371,7 +371,7 @@
       /***/
     },
 
-    /***/ 1942: /***/ (module, exports, __webpack_require__) => {
+    /***/ 5942: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -432,7 +432,7 @@
       /***/
     },
 
-    /***/ 2661: /***/ (
+    /***/ 485: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -448,9 +448,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(4496);
-      const _imageblursvg = __webpack_require__(4796);
-      const _imageconfig = __webpack_require__(72);
+      const _warnonce = __webpack_require__(1648);
+      const _imageblursvg = __webpack_require__(4812);
+      const _imageconfig = __webpack_require__(4664);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -852,7 +852,7 @@
       /***/
     },
 
-    /***/ 4796: /***/ (__unused_webpack_module, exports) => {
+    /***/ 4812: /***/ (__unused_webpack_module, exports) => {
       "use strict";
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
@@ -907,7 +907,7 @@
       /***/
     },
 
-    /***/ 1969: /***/ (
+    /***/ 8273: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -934,10 +934,10 @@
         },
       });
       const _interop_require_default = __webpack_require__(173);
-      const _getimgprops = __webpack_require__(2661);
-      const _imagecomponent = __webpack_require__(7342);
+      const _getimgprops = __webpack_require__(485);
+      const _imagecomponent = __webpack_require__(4369);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(3433)
+        __webpack_require__(6489)
       );
       function getImageProps(imgProps) {
         const { props } = (0, _getimgprops.getImgProps)(imgProps, {
@@ -969,7 +969,7 @@
       /***/
     },
 
-    /***/ 3433: /***/ (__unused_webpack_module, exports) => {
+    /***/ 6489: /***/ (__unused_webpack_module, exports) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -983,6 +983,7 @@
       });
       function defaultLoader(param) {
         let { config, src, width, quality } = param;
+        var _config_qualities;
         if (false) {
         }
         return (
@@ -992,7 +993,11 @@
           "&w=" +
           width +
           "&q=" +
-          (quality || 75) +
+          (quality ||
+            ((_config_qualities = config.qualities) == null
+              ? void 0
+              : _config_qualities.at(-1)) ||
+            75) + // TODO: is it safe to use .at()?
           (src.startsWith("/_next/static/media/") && false ? 0 : "")
         );
       }
@@ -1004,7 +1009,7 @@
       /***/
     },
 
-    /***/ 8448: /***/ (
+    /***/ 8926: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -1021,8 +1026,8 @@
 
       // EXTERNAL MODULE: ./node_modules/.pnpm/[email protected]/node_modules/react/jsx-runtime.js
       var jsx_runtime = __webpack_require__(5105);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@[email protected][email protected][email protected]/node_modules/next/image.js
-      var next_image = __webpack_require__(8140);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@[email protected][email protected][email protected]/node_modules/next/image.js
+      var next_image = __webpack_require__(5434);
       var image_default = /*#__PURE__*/ __webpack_require__.n(next_image); // ./pages/nextjs.png
       /* harmony default export */ const nextjs = {
         src: "/_next/static/media/nextjs.cae0b805.png",
@@ -1052,12 +1057,12 @@
       /***/
     },
 
-    /***/ 8140: /***/ (
+    /***/ 5434: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(1969);
+      module.exports = __webpack_require__(8273);
 
       /***/
     },
@@ -1067,7 +1072,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(3705)
+      __webpack_exec__(8255)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;

Diff for 8377-HASH.js

@@ -1,8 +1,8 @@
 "use strict";
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [8377],
+  [2727],
   {
-    /***/ 8377: /***/ (module, exports, __webpack_require__) => {
+    /***/ 2727: /***/ (module, exports, __webpack_require__) => {
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -13,27 +13,27 @@
           return Image;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
-      const _interop_require_wildcard = __webpack_require__(333);
-      const _jsxruntime = __webpack_require__(3094);
+      const _interop_require_default = __webpack_require__(384);
+      const _interop_require_wildcard = __webpack_require__(4261);
+      const _jsxruntime = __webpack_require__(7048);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const _reactdom = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(8307)
+        __webpack_require__(9221)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(8050)
+        __webpack_require__(1116)
       );
-      const _getimgprops = __webpack_require__(3201);
-      const _imageconfig = __webpack_require__(6678);
-      const _imageconfigcontextsharedruntime = __webpack_require__(578);
-      const _warnonce = __webpack_require__(1971);
-      const _routercontextsharedruntime = __webpack_require__(7795);
+      const _getimgprops = __webpack_require__(5763);
+      const _imageconfig = __webpack_require__(6224);
+      const _imageconfigcontextsharedruntime = __webpack_require__(6720);
+      const _warnonce = __webpack_require__(894);
+      const _routercontextsharedruntime = __webpack_require__(9093);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1315)
+        __webpack_require__(2809)
       );
-      const _usemergedref = __webpack_require__(592);
+      const _usemergedref = __webpack_require__(1329);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -355,7 +355,7 @@
       /***/
     },
 
-    /***/ 592: /***/ (module, exports, __webpack_require__) => {
+    /***/ 1329: /***/ (module, exports, __webpack_require__) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -365,7 +365,7 @@
           return useMergedRef;
         },
       });
-      const _react = __webpack_require__(1446);
+      const _react = __webpack_require__(228);
       function useMergedRef(refA, refB) {
         const cleanupA = (0, _react.useRef)(() => {});
         const cleanupB = (0, _react.useRef)(() => {});
@@ -414,7 +414,7 @@
       /***/
     },
 
-    /***/ 5318: /***/ (
+    /***/ 272: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -428,9 +428,9 @@
           return AmpStateContext;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
+      const _interop_require_default = __webpack_require__(384);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const AmpStateContext = _react.default.createContext({});
       if (false) {
@@ -439,7 +439,7 @@
       /***/
     },
 
-    /***/ 1210: /***/ (__unused_webpack_module, exports) => {
+    /***/ 1467: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -461,7 +461,7 @@
       /***/
     },
 
-    /***/ 3201: /***/ (
+    /***/ 5763: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -475,9 +475,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(1971);
-      const _imageblursvg = __webpack_require__(3482);
-      const _imageconfig = __webpack_require__(6678);
+      const _warnonce = __webpack_require__(894);
+      const _imageblursvg = __webpack_require__(5868);
+      const _imageconfig = __webpack_require__(6224);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -879,8 +879,8 @@
       /***/
     },
 
-    /***/ 8050: /***/ (module, exports, __webpack_require__) => {
-      /* provided dependency */ var process = __webpack_require__(6611);
+    /***/ 1116: /***/ (module, exports, __webpack_require__) => {
+      /* provided dependency */ var process = __webpack_require__(9829);
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -901,19 +901,19 @@
           return defaultHead;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
-      const _interop_require_wildcard = __webpack_require__(333);
-      const _jsxruntime = __webpack_require__(3094);
+      const _interop_require_default = __webpack_require__(384);
+      const _interop_require_wildcard = __webpack_require__(4261);
+      const _jsxruntime = __webpack_require__(7048);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const _sideeffect = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(4607)
+        __webpack_require__(4101)
       );
-      const _ampcontextsharedruntime = __webpack_require__(5318);
-      const _headmanagercontextsharedruntime = __webpack_require__(7060);
-      const _ampmode = __webpack_require__(1210);
-      const _warnonce = __webpack_require__(1971);
+      const _ampcontextsharedruntime = __webpack_require__(272);
+      const _headmanagercontextsharedruntime = __webpack_require__(1790);
+      const _ampmode = __webpack_require__(1467);
+      const _warnonce = __webpack_require__(894);
       function defaultHead(inAmpMode) {
         if (inAmpMode === void 0) inAmpMode = false;
         const head = [
@@ -1097,7 +1097,7 @@
       /***/
     },
 
-    /***/ 3482: /***/ (__unused_webpack_module, exports) => {
+    /***/ 5868: /***/ (__unused_webpack_module, exports) => {
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
        */
@@ -1151,7 +1151,7 @@
       /***/
     },
 
-    /***/ 578: /***/ (
+    /***/ 6720: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1165,11 +1165,11 @@
           return ImageConfigContext;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
+      const _interop_require_default = __webpack_require__(384);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
-      const _imageconfig = __webpack_require__(6678);
+      const _imageconfig = __webpack_require__(6224);
       const ImageConfigContext = _react.default.createContext(
         _imageconfig.imageConfigDefault
       );
@@ -1179,7 +1179,7 @@
       /***/
     },
 
-    /***/ 6678: /***/ (__unused_webpack_module, exports) => {
+    /***/ 6224: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -1221,13 +1221,14 @@
         contentDispositionType: "attachment",
         localPatterns: undefined,
         remotePatterns: [],
+        qualities: undefined,
         unoptimized: false,
       }; //# sourceMappingURL=image-config.js.map
 
       /***/
     },
 
-    /***/ 1315: /***/ (__unused_webpack_module, exports) => {
+    /***/ 2809: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -1239,6 +1240,7 @@
       });
       function defaultLoader(param) {
         let { config, src, width, quality } = param;
+        var _config_qualities;
         if (false) {
         }
         return (
@@ -1248,7 +1250,11 @@
           "&w=" +
           width +
           "&q=" +
-          (quality || 75) +
+          (quality ||
+            ((_config_qualities = config.qualities) == null
+              ? void 0
+              : _config_qualities.at(-1)) ||
+            75) + // TODO: is it safe to use .at()?
           (src.startsWith("/_next/static/media/") && false ? 0 : "")
         );
       }
@@ -1260,7 +1266,7 @@
       /***/
     },
 
-    /***/ 7795: /***/ (
+    /***/ 9093: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1274,9 +1280,9 @@
           return RouterContext;
         },
       });
-      const _interop_require_default = __webpack_require__(2952);
+      const _interop_require_default = __webpack_require__(384);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1446)
+        __webpack_require__(228)
       );
       const RouterContext = _react.default.createContext(null);
       if (false) {
@@ -1285,7 +1291,7 @@
       /***/
     },
 
-    /***/ 4607: /***/ (
+    /***/ 4101: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1299,7 +1305,7 @@
           return SideEffect;
         },
       });
-      const _react = __webpack_require__(1446);
+      const _react = __webpack_require__(228);
       const isServer = typeof window === "undefined";
       const useClientOnlyLayoutEffect = isServer
         ? () => {}

Diff for main-HASH.js

Diff too large to display

Diff for app-page-exp..ntime.dev.js

Diff too large to display

Diff for app-page-exp..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page.runtime.dev.js

Diff too large to display

Diff for app-page.runtime.prod.js

Diff too large to display

Diff for pages-turbo...time.prod.js

Diff too large to display

Diff for pages.runtime.dev.js

Diff too large to display

Diff for pages.runtime.prod.js

Diff too large to display

Commit: 3da81cc