fix(imagekit): set format param to "f" (#116)

* fix(imagekit): set format param to "f" Imagekit format param was incorrectly named "fm". This PR ensures the param is correctly named "f". * chore: format --------- Co-authored-by: Matt Kane <matt.kane@netlify.com>
ascorbic · Feb 7, 2024 · d06651e · d06651e
1 parent 1b6afb6
commit d06651e
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 43 deletions.
diff --git a/src/transformers/imagekit.test.ts b/src/transformers/imagekit.test.ts
@@ -1,8 +1,8 @@
 import { assertEquals } from "https://deno.land/std@0.172.0/testing/asserts.ts";
-import { transform, parse} from "./imagekit.ts";
+import { parse, transform } from "./imagekit.ts";
 
 const img =
-  "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-500,h-300,fm-png,q-80";
+  "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-500,h-300,f-png,q-80";
 
 Deno.test("imagekit", async (t) => {
   await t.step("should format a URL", () => {
@@ -13,23 +13,23 @@ Deno.test("imagekit", async (t) => {
     });
     assertEquals(
       result?.toString(),
-      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Ch-100%2Cfm-png%2Cq-80",
+      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Ch-100%2Cf-png%2Cq-80",
     );
   });
 
   await t.step("should not set height if not provided", () => {
     const result = transform({ url: img, width: 200 });
     assertEquals(
       result?.toString(),
-      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cfm-png%2Cq-80",
+      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cf-png%2Cq-80",
     );
   });
 
-  await t.step("should delete height if not set", () => {  
+  await t.step("should delete height if not set", () => {
     const result = transform({ url: img, width: 200 });
     assertEquals(
       result?.toString(),
-      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cfm-png%2Cq-80",
+      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cf-png%2Cq-80",
     );
   });
 
@@ -41,39 +41,41 @@ Deno.test("imagekit", async (t) => {
     });
     assertEquals(
       result?.toString(),
-      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-201%2Ch-100%2Cfm-png%2Cq-80",
+      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-201%2Ch-100%2Cf-png%2Cq-80",
     );
   });
 
-  await t.step("should set fm-auto if no format is provided", () => {
-
+  await t.step("should set f-auto if no format is provided", () => {
     const imgWithoutFormat =
-  "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-500,h-300,q-80";
+      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-500,h-300,q-80";
 
     const result = transform({ url: imgWithoutFormat, width: 200 });
     assertEquals(
       result?.toString(),
-      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cq-80%2Cfm-auto",
-    );
-  });
-
-  await t.step("should not set fm-auto if format is provided and use provided format", () => {
-    const result = transform({ url: img, width: 200, format: "jpg" });
-    assertEquals(
-      result?.toString(),
-      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cfm-jpg%2Cq-80",
+      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cq-80%2Cf-auto",
     );
   });
 
+  await t.step(
+    "should not set f-auto if format is provided and use provided format",
+    () => {
+      const result = transform({ url: img, width: 200, format: "jpg" });
+      assertEquals(
+        result?.toString(),
+        "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png?tr=w-200%2Cf-jpg%2Cq-80",
+      );
+    },
+  );
 
   await t.step("should parse url", () => {
     const result = parse(img);
 
-
-    assertEquals(result.base, "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png");
+    assertEquals(
+      result.base,
+      "https://ik.imagekit.io/subman/v2/asset-3d/icon-standard.png",
+    );
     assertEquals(result.width, 500);
     assertEquals(result.height, 300);
     assertEquals(result.format, "png");
   });
-
 });
diff --git a/src/transformers/imagekit.ts b/src/transformers/imagekit.ts
@@ -2,44 +2,43 @@ import { UrlParser, UrlTransformer } from "../types.ts";
 import { toUrl } from "../utils.ts";
 
 const getTransformParams = (url: URL) => {
-  const transforms = url.searchParams.get('tr') || "";
+  const transforms = url.searchParams.get("tr") || "";
 
-  return transforms.split(',').reduce((acc: any, transform: any)=> {
-    const [key, value] = transform.split('-');
+  return transforms.split(",").reduce((acc: any, transform: any) => {
+    const [key, value] = transform.split("-");
     acc[key] = value;
     return acc;
   }, {});
-}
-
+};
 
 export const transform: UrlTransformer = (
   { url: originalUrl, width, height, format },
 ) => {
   const url = toUrl(originalUrl);
   const transformParams = getTransformParams(url);
 
-  transformParams.w = width ? Math.round(width) : width
-  transformParams.h = height ? Math.round(height) : height
+  transformParams.w = width ? Math.round(width) : width;
+  transformParams.h = height ? Math.round(height) : height;
 
-  if(!transformParams.fm){
-    transformParams.fm = 'auto'
-  } 
+  if (!transformParams.f) {
+    transformParams.f = "auto";
+  }
 
-  if(format){
-    transformParams.fm = format
+  if (format) {
+    transformParams.f = format;
   }
 
-  const tr = Object.keys(transformParams).map(key => {
+  const tr = Object.keys(transformParams).map((key) => {
     const value = transformParams[key];
 
-    if(value){
+    if (value) {
       return `${key}-${value}`;
     }
   })
-  .filter(x => x)
-  .join(',');
+    .filter((x) => x)
+    .join(",");
 
-  url.searchParams.set('tr', tr);
+  url.searchParams.set("tr", tr);
 
   return url;
 };
@@ -48,11 +47,11 @@ export const parse: UrlParser = (
   url,
 ) => {
   const parsed = toUrl(url);
-  const transformParams = getTransformParams(parsed)
+  const transformParams = getTransformParams(parsed);
 
   const width = Number(transformParams.w) || undefined;
   const height = Number(transformParams.h) || undefined;
-  const format = transformParams.fm || undefined;
+  const format = transformParams.f || undefined;
 
   parsed.search = "";
 
@@ -65,5 +64,3 @@ export const parse: UrlParser = (
     cdn: "imagekit",
   };
 };
-
-