fix v1 url generation to correctly support border objects and strings (#384)

* fix v1 url generation to correctly support border objects and strings

Author: patrick-tolosa

__TESTS__/backwardsComaptibility/createV1URL.test.ts

@@ -238,4 +238,25 @@ describe('Create v1 urls', () => {
       expect(createCloudinaryV1URL(source, {cloud_name: 'demo'})).toEqual(`https://res.cloudinary.com/demo/image/upload/${target}`);
     });
   });
+
+  it("Should generate transformation with border objects", function () {
+    const url = createCloudinaryV1URL("sample", {
+      cloud_name: 'demo',
+      border: {
+        width: 5,
+        color: '#ffaabbdd'
+      }
+    });
+
+    expect(url).toContain(`image/upload/bo_5px_solid_rgb:ffaabbdd/sample`);
+  });
+
+  it("Should generate transformation with border string", function () {
+    const url = createCloudinaryV1URL("sample", {
+      cloud_name: 'demo',
+      border: '4px_solid_white'
+    });
+
+    expect(url).toContain(`image/upload/bo_4px_solid_white/sample`);
+  });
 });

src/backwards/generateTransformationString.ts

@@ -66,7 +66,6 @@ export function generateTransformationString(transformationOptions: V1ITransfora
   let namedTransformations = [];
   let childTransformations = toArray(transformationOptions.transformation || []);
   let effect = transformationOptions.effect;
-  let border = transformationOptions.border;
 
   // TODO, Do we need this?
   const no_html_sizes = hasLayer || angle || crop === "fit" || crop === "limit";
@@ -118,9 +117,15 @@ export function generateTransformationString(transformationOptions: V1ITransfora
     );
   }
 
-  let borderParam;
+  let border = transformationOptions.border;
   if (isObject(border)) {
-    borderParam = `${border.width != null ? border.width : 2}px_solid_${(border.color != null ? border.color : "black").replace(/^#/, 'rgb:')}`;
+    border = `${border.width != null ? border.width : 2}px_solid_${(border.color != null ? border.color : "black").replace(/^#/, 'rgb:')}`;
+  } else {
+    // @ts-ignore
+    if (/^\d+$/.exec(border)) { // fallback to html border attributes
+      transformationOptions.border = border;
+      border = void 0;
+    }
   }
 
   if (Array.isArray(fps)) {

src/backwards/types.ts

@@ -274,7 +274,7 @@ export interface V1ITransforamtionOptions {
   border?: {
     width?: stringOrNumber;
     color?: string;
-  };
+  } | string;
   default_image?: string;
   density?: stringOrNumber;
   format?: ImageFormat;

src/backwards/utils/isObject.ts

@@ -3,6 +3,6 @@
  *
  * @param a
  */
-export function isObject(a: any): boolean {
+export function isObject(a: any): a is Record<string, any> {
   return typeof a === 'object' && a !== null;
 }