Drop jpg, png as default image cdn formats

simonihmig · Nov 20, 2024 · 1f3b3d9 · 1f3b3d9
1 parent 7966e5b
commit 1f3b3d9
Show file tree

Hide file tree

Showing 10 changed files with 30 additions and 21 deletions.
diff --git a/.changeset/giant-lobsters-type.md b/.changeset/giant-lobsters-type.md
@@ -0,0 +1,5 @@
+---
+'@responsive-image/cdn': major
+---
+
+Drop jpg, png as default image cdn formats
diff --git a/apps/ember-test-app/tests/integration/helpers/responsive-image-cloudinary-provider-test.gts b/apps/ember-test-app/tests/integration/helpers/responsive-image-cloudinary-provider-test.gts
@@ -15,7 +15,7 @@ module(
       data = argument;
     };
 
-    test("it supports all image types", async function (assert) {
+    test("it supports default image types", async function (assert) {
       await render(
         <template>
           {{dump
@@ -24,7 +24,7 @@ module(
         </template>,
       );
 
-      assert.deepEqual(data?.imageTypes, ["png", "jpeg", "webp", "avif"]);
+      assert.deepEqual(data?.imageTypes, ["webp", "avif"]);
     });
 
     test("it returns correct upload image URLs", async function (assert) {

diff --git a/apps/ember-test-app/tests/integration/helpers/responsive-image-imgix-provider-test.gts b/apps/ember-test-app/tests/integration/helpers/responsive-image-imgix-provider-test.gts
@@ -14,14 +14,14 @@ module(
       data = argument;
     };
 
-    test("it supports jpg, png and webp image types", async function (assert) {
+    test("it supports default image types", async function (assert) {
       await render(
         <template>
           {{dump (responsiveImageImgixProvider "foo/bar.jpg")}}
         </template>,
       );
 
-      assert.deepEqual(data?.imageTypes, ["png", "jpeg", "webp"]);
+      assert.deepEqual(data?.imageTypes, ["webp", "avif"]);
     });
 
     test("it returns correct image URLs", async function (assert) {

diff --git a/apps/ember-test-app/tests/integration/helpers/responsive-image-netlify-provider-test.gts b/apps/ember-test-app/tests/integration/helpers/responsive-image-netlify-provider-test.gts
@@ -21,14 +21,14 @@ module(
       setConfig<Config>("cdn", { netlify: { domain: "dummy.netlify.app" } });
     });
 
-    test("it supports all image types", async function (assert) {
+    test("it supports default image types", async function (assert) {
       await render(
         <template>
           {{dump (responsiveImageNetlifyProvider "/foo/bar.jpg")}}
         </template>,
       );
 
-      assert.deepEqual(data?.imageTypes, ["png", "jpeg", "webp", "avif"]);
+      assert.deepEqual(data?.imageTypes, ["webp", "avif"]);
     });
 
     test("it returns correct relative image URLs", async function (assert) {

diff --git a/packages/cdn/src/cloudinary.ts b/packages/cdn/src/cloudinary.ts
@@ -47,7 +47,7 @@ export function cloudinaryProvider(
   }
 
   return {
-    imageTypes: options.formats ?? ['png', 'jpeg', 'webp', 'avif'],
+    imageTypes: options.formats ?? ['webp', 'avif'],
     imageUrlFor(width: number, type: ImageType = 'jpeg'): string {
       const resizeParams: CloudinaryTransformation = {
         w: width,

diff --git a/packages/cdn/src/imgix.ts b/packages/cdn/src/imgix.ts
@@ -28,7 +28,7 @@ export function imgixProvider(
   assert('domain must be set for imgix provider!', typeof domain === 'string');
 
   return {
-    imageTypes: options.formats ?? ['png', 'jpeg', 'webp'],
+    imageTypes: options.formats ?? ['webp', 'avif'],
     imageUrlFor(width: number, type: ImageType = 'jpeg'): string {
       const url = new URL(`https://${domain}/${normalizeSrc(image)}`);
       const params = url.searchParams;

diff --git a/packages/cdn/src/netlify.ts b/packages/cdn/src/netlify.ts
@@ -27,7 +27,7 @@ export function netlifyProvider(
   const url = image;
 
   return {
-    imageTypes: options.formats ?? ['png', 'jpeg', 'webp', 'avif'],
+    imageTypes: options.formats ?? ['webp', 'avif'],
     imageUrlFor(width: number, type: ImageType = 'jpeg'): string {
       const params = new URLSearchParams({
         url,

diff --git a/packages/cdn/tests/cloudinary.test.ts b/packages/cdn/tests/cloudinary.test.ts
@@ -7,16 +7,18 @@ describe('cloudinary', function () {
     setConfig<Config>('cdn', { cloudinary: { cloudName: 'dummy' } });
   });
 
-  test('it supports jpg, png, webp, avif image types by default', function () {
+  test('it supports webp, avif image types by default', function () {
     const result = cloudinaryProvider('foo/bar.jpg');
 
-    expect(result?.imageTypes).toEqual(['png', 'jpeg', 'webp', 'avif']);
+    expect(result?.imageTypes).toEqual(['webp', 'avif']);
   });
 
   test('it supports custom image types', function () {
-    const result = cloudinaryProvider('foo/bar.jpg', { formats: ['webp'] });
+    const result = cloudinaryProvider('foo/bar.jpg', {
+      formats: ['jpeg', 'webp'],
+    });
 
-    expect(result?.imageTypes).toEqual(['webp']);
+    expect(result?.imageTypes).toEqual(['jpeg', 'webp']);
   });
 
   test('it returns correct fetch image URLs', function () {

diff --git a/packages/cdn/tests/imgix.test.ts b/packages/cdn/tests/imgix.test.ts
@@ -7,16 +7,16 @@ describe('imgix', function () {
     setConfig<Config>('cdn', { imgix: { domain: 'dummy.imgix.net' } });
   });
 
-  test('it supports jpg, png and webp image types by default', function () {
+  test('it supports webp, avif image types by default', function () {
     const result = imgixProvider('foo/bar.jpg');
 
-    expect(result?.imageTypes).toEqual(['png', 'jpeg', 'webp']);
+    expect(result?.imageTypes).toEqual(['webp', 'avif']);
   });
 
   test('it supports custom image types', function () {
-    const result = imgixProvider('foo/bar.jpg', { formats: ['webp'] });
+    const result = imgixProvider('foo/bar.jpg', { formats: ['jpeg', 'webp'] });
 
-    expect(result?.imageTypes).toEqual(['webp']);
+    expect(result?.imageTypes).toEqual(['jpeg', 'webp']);
   });
 
   test('it returns correct image URLs', function () {

diff --git a/packages/cdn/tests/netlify.test.ts b/packages/cdn/tests/netlify.test.ts
@@ -7,16 +7,18 @@ describe('netlify', function () {
     setConfig<Config>('cdn', { netlify: { domain: 'dummy.netlify.app' } });
   });
 
-  test('it supports jpg, png, webp, avif image types by default', function () {
+  test('it supports webp, avif image types by default', function () {
     const result = netlifyProvider('/foo/bar.jpg');
 
-    expect(result?.imageTypes).toEqual(['png', 'jpeg', 'webp', 'avif']);
+    expect(result?.imageTypes).toEqual(['webp', 'avif']);
   });
 
   test('it supports custom image types', function () {
-    const result = netlifyProvider('/foo/bar.jpg', { formats: ['webp'] });
+    const result = netlifyProvider('/foo/bar.jpg', {
+      formats: ['jpeg', 'webp'],
+    });
 
-    expect(result?.imageTypes).toEqual(['webp']);
+    expect(result?.imageTypes).toEqual(['jpeg', 'webp']);
   });
 
   test('it returns correct relative image URLs', function () {