test: add test cases

Author: utkace

tests/stories/0-ImageKitContext.stories.js

@@ -0,0 +1,16 @@
+import IKImage from '../../src/components/IKImage.vue';
+import IKContext from '../../src/components/IKContext.vue';
+export default {
+  title: 'IKContext',
+};
+
+
+const urlEndpoint = process.env.VUE_APP_URL_ENDPOINT;
+const publicKey = process.env.VUE_APP_PUBLIC_KEY;
+
+export const imageWithContext = () => ({
+  components: { IKImage, IKContext },
+  template: `<IKContext publicKey="${publicKey}" urlEndpoint=${urlEndpoint}><IKImage src="https://ik.imagekit.io/gqyojxcwzxj/ABC_BV8lzpfOS"/></IKContext>`,
+});
+
+

tests/stories/1-ImageKitImage.stories.js

@@ -0,0 +1,33 @@
+import IKImage from '../../src/components/IKImage.vue';
+
+export default {
+  title: 'IKImage',
+};
+
+const urlEndpoint = process.env.VUE_APP_URL_ENDPOINT;
+const publicKey = process.env.VUE_APP_PUBLIC_KEY;
+
+export const imageWithSrc = () => ({
+  components: { IKImage },
+  template: `<IKImage publicKey="${publicKey}" urlEndpoint=${urlEndpoint} src="https://ik.imagekit.io/gqyojxcwzxj/ABC_BV8lzpfOS"/>`,
+});
+
+export const imageWithPath = () => ({
+  components: { IKImage },
+  template: `<IKImage publicKey="${publicKey}" urlEndpoint=${urlEndpoint} path="/ABC_BV8lzpfOS"/>`,
+});
+
+export const imageWithLQIP = () => ({
+  components: { IKImage },
+  template: `<IKImage publicKey="${publicKey}" urlEndpoint=${urlEndpoint} src="https://ik.imagekit.io/gqyojxcwzxj/ABC_BV8lzpfOS" v-bind:lqip="{active:true,threshold:20}"/>`,
+});
+
+export const imageWithNoPublicKey = () => ({
+  components: { IKImage },
+  template: `<IKImage publicKey="" urlEndpoint=${urlEndpoint} src="https://ik.imagekit.io/gqyojxcwzxj/ABC_BV8lzpfOS"/>`,
+});
+
+export const imageWithNoUrlEndpoint = () => ({
+  components: { IKImage },
+  template: `<IKImage publicKey="${publicKey}" urlEndpoint="" src="https://ik.imagekit.io/gqyojxcwzxj/ABC_BV8lzpfOS"/>`,
+});

tests/stories/2-Transformations.stories.js

@@ -0,0 +1,18 @@
+import IKImage from '../../src/components/IKImage.vue';
+
+export default {
+  title: 'Transformations',
+};
+
+const urlEndpoint = process.env.VUE_APP_URL_ENDPOINT;
+const publicKey = process.env.VUE_APP_PUBLIC_KEY;
+
+export const imageWithTransformation = () => ({
+  components: { IKImage },
+  template: `<IKImage publicKey="${publicKey}" urlEndpoint=${urlEndpoint} src="https://ik.imagekit.io/gqyojxcwzxj/ABC_BV8lzpfOS" v-bind:transformation="[{height:300,width:400}]" />`,
+});
+
+export const imageWithChainedTransformation = () => ({
+  components: { IKImage },
+  template: `<IKImage publicKey="${publicKey}" urlEndpoint=${urlEndpoint} src="https://ik.imagekit.io/gqyojxcwzxj/ABC_BV8lzpfOS" v-bind:transformation="[{height:300,width:400},{rotation:90}]" />`,
+});

tests/stories/3-UploadImage.stories.js

@@ -0,0 +1,35 @@
+import IKUpload from '../../src/components/IKUpload.vue';
+import IKContext from '../../src/components/IKContext.vue';
+export default {
+  title: 'IKUpload',
+};
+
+const urlEndpoint = process.env.VUE_APP_URL_ENDPOINT;
+const publicKey = process.env.VUE_APP_PUBLIC_KEY;
+const authenticationEndpoint = process.env.VUE_APP_AUTHENTICATION_ENDPOINT;
+
+export const ImageUpload = () => ({
+  components: { IKUpload,IKContext },
+  template: `<IKContext publicKey="${publicKey}" urlEndpoint=${urlEndpoint} authenticationEndpoint=${authenticationEndpoint}><IKUpload fileName="new"/></IKContext>`,
+});
+
+export const ImageUploadwithAllProps = () => ({
+  components: { IKUpload,IKContext },
+  template: `<IKContext publicKey="${publicKey}" urlEndpoint=${urlEndpoint} authenticationEndpoint=${authenticationEndpoint}><IKUpload fileName="'new'" v-bind:useUniqueFileName="true" v-bind:tags="['tag1', 'tag2', 'tag3']" v-bind:folder="'/'" v-bind:isPrivateFile="true" v-bind:customCoordinates="'0,0,0,0'" v-bind:responseFields="['tags', 'isPrivateFile', 'customCoordinates']" /></IKContext>`,
+});
+
+export const ImageUploadwithNoTags = () => ({
+  components: { IKUpload,IKContext },
+  template: `<IKContext publicKey="${publicKey}" urlEndpoint=${urlEndpoint} authenticationEndpoint=${authenticationEndpoint}><IKUpload fileName="'new'" v-bind:useUniqueFileName="true" v-bind:folder="'/'" v-bind:isPrivateFile="true" v-bind:customCoordinates="'0,0,0,0'" v-bind:responseFields="['isPrivateFile', 'customCoordinates']" /></IKContext>`,
+});
+
+export const ImageUploadwithNoCustomCoordinates = () => ({
+  components: { IKUpload,IKContext },
+  template: `<IKContext publicKey="${publicKey}" urlEndpoint=${urlEndpoint} authenticationEndpoint=${authenticationEndpoint}><IKUpload fileName="'new'" v-bind:useUniqueFileName="false" v-bind:tags="['tag1', 'tag2', 'tag3']" v-bind:folder="'/'" v-bind:isPrivateFile="false" v-bind:responseFields="['tags', 'isPrivateFile']" /></IKContext>`,
+});
+
+export const ImageUploadnoAuthentication = () => ({
+  components: { IKUpload,IKContext },
+  template: `<IKContext publicKey="${publicKey}" urlEndpoint=${urlEndpoint} authenticationEndpoint=""><IKUpload fileName="new"/></IKContext>`,
+});
+

tests/storyshots.test.js

@@ -0,0 +1,12 @@
+import initStoryshots from '@storybook/addon-storyshots';
+
+initStoryshots({ /* configuration options */ });
+
+// Dates get changed in snapshots depending on timezone of bulding machine,
+// So we set a default date or moment for all dates.
+const DATE_TO_USE = new Date('2019');
+const _Date = Date;
+global.Date = jest.fn(() => DATE_TO_USE);
+global.Date.UTC = _Date.UTC;
+global.Date.parse = _Date.parse;
+global.Date.now = _Date.now;