fix: removing port from url in test and fixing import of JS SDK

vvdwivedi · vvdwivedi · commit 66d10dc2ffc6 · 2020-03-05T10:53:03.000+05:30
diff --git a/samples/imagekitio-angular4-sample/package.json b/samples/imagekitio-angular4-sample/package.json
@@ -22,6 +22,7 @@
     "@angular/platform-browser-dynamic": "^4.2.4",
     "@angular/router": "^4.2.4",
     "core-js": "^2.4.1",
+    "imagekitio-angular": "file:../../sdk/dist/imagekitio-angular/imagekitio-angular-0.0.1.tgz",
     "rxjs": "^5.4.2",
     "zone.js": "^0.8.14"
   },
diff --git a/samples/imagekitio-angular4-sample/src/app/app.component.html b/samples/imagekitio-angular4-sample/src/app/app.component.html
@@ -1,14 +1,14 @@
 <div className="App">
   <h1>Hi! This is an ImageKit Angular SDK Demo!</h1>
   <p>Let's add an Image</p>
-  <ik-image src={{src}} alt="This is an alt">
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" alt="This is an alt">
   </ik-image>
   <p>Let's transform this once</p>
-  <ik-image src={{src}} [transformation]="transformationOne"></ik-image>
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" [transformation]="transformationOne"></ik-image>
   <p>Let's transform this more than once</p>
   <ik-image path="{{path}}" [transformation]="transformationTwo"></ik-image>
   <p>LQIP</p>
-  <ik-image path="{{path}}" [lqip]="lqip"></ik-image>
+  <ik-image path="{{path}}" [lqip]="lqip" alt="this is alt"></ik-image>
   <p>Upload</p>
   <p>To use this funtionality please remember to setup the server</p>
   <p>Provide custom upload method</p>
diff --git a/samples/imagekitio-angular4-sample/src/app/app.component.ts b/samples/imagekitio-angular4-sample/src/app/app.component.ts
@@ -9,22 +9,14 @@ export class AppComponent {
   title = 'app';
   transformationOne = [{ height: "200", width: "200" }];
   path = "/default-image.jpg";
-  urlEndpoint = '<YOUR_URL_ENDPOINT>';
-  getSrcFromPath = function getSrcFromPath(path: string, urlEndpoint:string) {
-    if(path[0] === "/")
-      path = path.split("/")[1];
-    return `${urlEndpoint}/${path}`;
-  };
-
-  src = this.getSrcFromPath(this.path, this.urlEndpoint);
 
   transformationTwo = [
     { height: "200", width: "200" },
     {
       rotation: "90"
     }
   ];
-  lqip = { active: true, quality: 30 };
+  lqip = { active: true, quality: 1 };
 
   handleUploadSuccess(res) {
     console.log('File upload success with response: ', res);
diff --git a/samples/imagekitio-angular5-sample/src/app/app.component.html b/samples/imagekitio-angular5-sample/src/app/app.component.html
@@ -1,14 +1,14 @@
 <div className="App">
   <h1>Hi! This is an ImageKit Angular SDK Demo!</h1>
   <p>Let's add an Image</p>
-  <ik-image src={{src}} alt="This is an alt">
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" alt="This is an alt">
   </ik-image>
   <p>Let's transform this once</p>
-  <ik-image src={{src}} [transformation]="transformationOne"></ik-image>
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" [transformation]="transformationOne"></ik-image>
   <p>Let's transform this more than once</p>
   <ik-image path="{{path}}" [transformation]="transformationTwo"></ik-image>
   <p>LQIP</p>
-  <ik-image path="{{path}}" [lqip]="lqip"></ik-image>
+  <ik-image path="{{path}}" [lqip]="lqip" alt="this is alt"></ik-image>
   <p>Upload</p>
   <p>To use this funtionality please remember to setup the server</p>
   <p>Provide custom upload method</p>
diff --git a/samples/imagekitio-angular5-sample/src/app/app.component.ts b/samples/imagekitio-angular5-sample/src/app/app.component.ts
@@ -9,22 +9,14 @@ export class AppComponent {
   title = 'app';
   transformationOne = [{ height: "200", width: "200" }];
   path = "/default-image.jpg";
-  urlEndpoint = '<YOUR_URL_ENDPOINT>';
-  getSrcFromPath = function getSrcFromPath(path: string, urlEndpoint:string) {
-    if(path[0] === "/")
-      path = path.split("/")[1];
-    return `${urlEndpoint}/${path}`;
-  };
-
-  src = this.getSrcFromPath(this.path, this.urlEndpoint);
 
   transformationTwo = [
     { height: "200", width: "200" },
     {
       rotation: "90"
     }
   ];
-  lqip = { active: true, quality: 30 };
+  lqip = { active: true, quality: 1 };
 
   handleUploadSuccess(res) {
     console.log('File upload success with response: ', res);
diff --git a/samples/imagekitio-angular6-sample/src/app/app.component.html b/samples/imagekitio-angular6-sample/src/app/app.component.html
@@ -1,14 +1,14 @@
 <div className="App">
   <h1>Hi! This is an ImageKit Angular SDK Demo!</h1>
   <p>Let's add an Image</p>
-  <ik-image src={{src}} alt="This is an alt">
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" alt="This is an alt">
   </ik-image>
   <p>Let's transform this once</p>
-  <ik-image src={{src}} [transformation]="transformationOne"></ik-image>
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" [transformation]="transformationOne"></ik-image>
   <p>Let's transform this more than once</p>
   <ik-image path="{{path}}" [transformation]="transformationTwo"></ik-image>
   <p>LQIP</p>
-  <ik-image path="{{path}}" [lqip]="lqip"></ik-image>
+  <ik-image path="{{path}}" [lqip]="lqip" alt="this is alt"></ik-image>
   <p>Upload</p>
   <p>To use this funtionality please remember to setup the server</p>
   <p>Provide custom upload method</p>
diff --git a/samples/imagekitio-angular6-sample/src/app/app.component.ts b/samples/imagekitio-angular6-sample/src/app/app.component.ts
@@ -9,22 +9,14 @@ export class AppComponent {
   title = 'app';
   transformationOne = [{ height: "200", width: "200" }];
   path = "/default-image.jpg";
-  urlEndpoint = '';
-  getSrcFromPath = function getSrcFromPath(path: string, urlEndpoint:string) {
-    if(path[0] === "/")
-      path = path.split("/")[1];
-    return `${urlEndpoint}/${path}`;
-  };
-
-  src = this.getSrcFromPath(this.path, this.urlEndpoint);
 
   transformationTwo = [
     { height: "200", width: "200" },
     {
       rotation: "90"
     }
   ];
-  lqip = { active: true, quality: 30 };
+  lqip = { active: true, quality: 1 };
 
   handleUploadSuccess(res) {
     console.log('File upload success with response: ', res);
diff --git a/samples/imagekitio-angular7-sample/src/app/app.component.html b/samples/imagekitio-angular7-sample/src/app/app.component.html
@@ -1,14 +1,14 @@
 <div className="App">
   <h1>Hi! This is an ImageKit Angular SDK Demo!</h1>
   <p>Let's add an Image</p>
-  <ik-image src={{src}} alt="This is an alt">
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" alt="This is an alt">
   </ik-image>
   <p>Let's transform this once</p>
-  <ik-image src={{src}} [transformation]="transformationOne"></ik-image>
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" [transformation]="transformationOne"></ik-image>
   <p>Let's transform this more than once</p>
   <ik-image path="{{path}}" [transformation]="transformationTwo"></ik-image>
   <p>LQIP</p>
-  <ik-image path="{{path}}" [lqip]="lqip"></ik-image>
+  <ik-image path="{{path}}" [lqip]="lqip" alt="this is alt"></ik-image>
   <p>Upload</p>
   <p>To use this funtionality please remember to setup the server</p>
   <p>Provide custom upload method</p>
diff --git a/samples/imagekitio-angular7-sample/src/app/app.component.ts b/samples/imagekitio-angular7-sample/src/app/app.component.ts
@@ -9,22 +9,14 @@ export class AppComponent {
   title = 'app';
   transformationOne = [{ height: "200", width: "200" }];
   path = "/default-image.jpg";
-  urlEndpoint = '';
-  getSrcFromPath = function getSrcFromPath(path: string, urlEndpoint:string) {
-    if(path[0] === "/")
-      path = path.split("/")[1];
-    return `${urlEndpoint}/${path}`;
-  };
-
-  src = this.getSrcFromPath(this.path, this.urlEndpoint);
 
   transformationTwo = [
     { height: "200", width: "200" },
     {
       rotation: "90"
     }
   ];
-  lqip = { active: true, quality: 30 };
+  lqip = { active: true, quality: 1 };
 
   handleUploadSuccess(res) {
     console.log('File upload success with response: ', res);
diff --git a/samples/imagekitio-angular8-sample/src/app/app.component.html b/samples/imagekitio-angular8-sample/src/app/app.component.html
@@ -1,14 +1,14 @@
 <div className="App">
   <h1>Hi! This is an ImageKit Angular SDK Demo!</h1>
   <p>Let's add an Image</p>
-  <ik-image src={{src}} alt="This is an alt">
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" alt="This is an alt">
   </ik-image>
   <p>Let's transform this once</p>
-  <ik-image src={{src}} [transformation]="transformationOne"></ik-image>
+  <ik-image src="https://ik.imagekit.io/18ykd9wzp/default-image.jpg" [transformation]="transformationOne"></ik-image>
   <p>Let's transform this more than once</p>
   <ik-image path="{{path}}" [transformation]="transformationTwo"></ik-image>
   <p>LQIP</p>
-  <ik-image path="{{path}}" [lqip]="lqip"></ik-image>
+  <ik-image path="{{path}}" [lqip]="lqip" alt="this is alt"></ik-image>
   <p>Upload</p>
   <p>To use this funtionality please remember to setup the server</p>
   <p>Provide custom upload method</p>
diff --git a/samples/imagekitio-angular8-sample/src/app/app.component.ts b/samples/imagekitio-angular8-sample/src/app/app.component.ts
@@ -9,22 +9,14 @@ export class AppComponent {
   title = 'app';
   transformationOne = [{ height: "200", width: "200" }];
   path = "/default-image.jpg";
-  urlEndpoint = '';
-  getSrcFromPath = function getSrcFromPath(path: string, urlEndpoint:string) {
-    if(path[0] === "/")
-      path = path.split("/")[1];
-    return `${urlEndpoint}/${path}`;
-  };
-
-  src = this.getSrcFromPath(this.path, this.urlEndpoint);
 
   transformationTwo = [
     { height: "200", width: "200" },
     {
       rotation: "90"
     }
   ];
-  lqip = { active: true, quality: 30 };
+  lqip = { active: true, quality: 1 };
 
   handleUploadSuccess(res) {
     console.log('File upload success with response: ', res);
diff --git a/sdk/lib/src/imagekitio-angular/imagekit.service.ts b/sdk/lib/src/imagekitio-angular/imagekit.service.ts
@@ -1,5 +1,6 @@
 import { Injectable } from "@angular/core";
-import * as ImageKit from "imagekit-javascript";
+// import ImageKit from "imagekit-javascript";
+const ImageKit = require("imagekit-javascript")
 const pjson = require("../../package.json");
 
 export interface Lqip {
diff --git a/sdk/src/sdk-tests/ik-image.component.spec.ts b/sdk/src/sdk-tests/ik-image.component.spec.ts
@@ -19,8 +19,8 @@ describe("IkImageComponent", () => {
   });
 
   it("urlEndpoint passed to component should be used over initialized value", () => {
-    component.setUrl(null, "def", null, null, 'localhost:3000');
-    expect(component.url).toBe(`localhost:3000/def?ik-sdk-version=${version}`);
+    component.setUrl(null, "def", null, null, 'https://example.com');
+    expect(component.url).toBe(`https://example.com/def?ik-sdk-version=${version}`);
   });
 
   it("Presence and absence of trailing slash in should not result in double slash (//) in the returned url", () => {
