Adjust jest test cases

guerler · Aug 9, 2023 · 301a9a7 · 301a9a7
1 parent 4bc76b3
commit 301a9a7
Show file tree

Hide file tree

Showing 8 changed files with 108 additions and 113 deletions.
diff --git a/client/src/components/Upload/Collection.test.js b/client/src/components/Upload/Collection.test.js
diff --git a/client/src/components/Upload/Composite.test.js b/client/src/components/Upload/Composite.test.js
@@ -1,17 +1,34 @@
-import { mountWithDetails } from "./testHelpers";
+import { mount } from "@vue/test-utils";
+import { getLocalVue } from "tests/jest/helpers";
 
-import Composite from "./Composite.vue";
+import mountTarget from "./Composite.vue";
 
-describe("Composite.vue", () => {
-    it("loads with correct initial state", async () => {
-        const { wrapper } = mountWithDetails(Composite);
+const localVue = getLocalVue();
+
+function getWrapper() {
+    return mount(mountTarget, {
+        propsData: {
+            defaultDbKey: "?",
+            effectiveExtensions: [{ id: "affybatch", composite_files: [] }],
+            fileSourcesConfigured: true,
+            ftpUploadSite: null,
+            historyId: "historyId",
+            listDbKeys: [],
+        },
+        localVue,
+    });
+}
+
+describe("Composite", () => {
+    it("rendering", async () => {
+        const wrapper = getWrapper();
         expect(wrapper.find("#btn-start").classes()).toEqual(expect.arrayContaining(["disabled"]));
         expect(wrapper.vm.showHelper).toBe(true);
         expect(wrapper.vm.readyStart).toBe(false);
-        // filters listExtensions to just the composite definition + _select_ value
-        const extensions = wrapper.vm.extensions;
+        const extensions = wrapper.vm.listExtensions;
         expect(extensions.length).toBe(2);
-        expect(extensions[0].id).toBe("_select_");
+        expect(extensions[0].id).toBe(null);
+        expect(extensions[0].text).toBe("Select");
         expect(extensions[1].id).toBe("affybatch");
     });
 });
diff --git a/client/src/components/Upload/Composite.vue b/client/src/components/Upload/Composite.vue
@@ -155,6 +155,12 @@ function restoreStatus() {
         model.status = "init";
     });
 }
+
+defineExpose({
+    listExtensions,
+    readyStart,
+    showHelper,
+});
 </script>
 
 <template>

diff --git a/client/src/components/Upload/Default.test.js b/client/src/components/Upload/Default.test.js
@@ -1,55 +1,65 @@
-import Backbone from "backbone";
-import UploadRow from "mvc/upload/default/default-row";
+import { mount } from "@vue/test-utils";
+import { getLocalVue } from "tests/jest/helpers";
 
-import { mountWithDetails } from "./testHelpers";
+import mountTarget from "./Default.vue";
 
-import Default from "./Default.vue";
+const localVue = getLocalVue();
 
-jest.mock("app");
-
-jest.mock("mvc/upload/default/default-row");
-UploadRow.mockImplementation(Backbone.View);
+function getWrapper() {
+    return mount(mountTarget, {
+        propsData: {
+            chunkUploadSize: 100,
+            defaultDbKey: "?",
+            defaultExtension: "auto",
+            effectiveExtensions: [{ id: "ab1" }],
+            fileSourcesConfigured: true,
+            ftpUploadSite: null,
+            historyId: "historyId",
+            lazyLoad: 3,
+            listDbKeys: [],
+        },
+        localVue,
+        stubs: {
+            FontAwesomeIcon: true,
+        },
+    });
+}
 
-describe("Default.vue", () => {
-    it("loads with correct initial state", async () => {
-        const { wrapper } = mountWithDetails(Default);
+describe("Default", () => {
+    it("rendering", async () => {
+        const wrapper = getWrapper();
         expect(wrapper.vm.counterAnnounce).toBe(0);
         expect(wrapper.vm.showHelper).toBe(true);
-        expect(wrapper.vm.extensions[0].id).toBe("ab1");
+        expect(wrapper.vm.listExtensions[0].id).toBe("ab1");
         expect(wrapper.find("#btn-reset").classes()).toEqual(expect.arrayContaining(["disabled"]));
         expect(wrapper.find("#btn-start").classes()).toEqual(expect.arrayContaining(["disabled"]));
         expect(wrapper.find("#btn-stop").classes()).toEqual(expect.arrayContaining(["disabled"]));
     });
 
-    it("does render FTP is site set", async () => {
-        const { wrapper } = mountWithDetails(Default);
-        expect(wrapper.find("#btn-ftp").element).toBeVisible();
-        await wrapper.find("#btn-ftp").trigger("click");
-        // TODO: test popover appears... not sure best way to do this...
-    });
-
-    it("doesn't render FTP is no site set", async () => {
-        const { wrapper } = mountWithDetails(Default, {
-            currentFtp: null,
-        });
-        expect(wrapper.findAll("#btn-ftp").length).toBe(0);
-    });
-
     it("resets properly", async () => {
-        const { wrapper, localVue } = mountWithDetails(Default);
+        const wrapper = getWrapper();
         expect(wrapper.vm.showHelper).toBe(true);
-        await localVue.nextTick();
         await wrapper.find("#btn-new").trigger("click");
         expect(wrapper.vm.showHelper).toBe(false);
         expect(wrapper.vm.counterAnnounce).toBe(1);
         await wrapper.find("#btn-reset").trigger("click");
         expect(wrapper.vm.showHelper).toBe(true);
     });
 
-    it("renders a limitloader element if lazyLoadMax set", async () => {
-        const { wrapper } = mountWithDetails(Default, {}, { lazyLoadMax: 2 });
-        expect(wrapper.findAll(".ui-limitloader").length).toBe(1);
-        // hard to actually test the functionality like in Collection.test.js
-        // because we're stubbing out all of UploadRow.
+    it("does render remote files button", async () => {
+        const wrapper = getWrapper();
+        expect(wrapper.find("#btn-remote-files").exists()).toBeTruthy();
+        await wrapper.setProps({ fileSourcesConfigured: false });
+        expect(wrapper.find("#btn-remote-files").exists()).toBeFalsy();
+    });
+
+    it("renders a limited set", async () => {
+        const wrapper = getWrapper();
+        for (let i = 0; i < 5; i++) {
+            await wrapper.find("#btn-new").trigger("click");
+        }
+        expect(wrapper.findAll(".upload-row").length).toBe(3);
+        const textMessage = wrapper.find("[data-description='lazyload message']");
+        expect(textMessage.text()).toBe("Only showing first 3 of 5 entries.");
     });
 });
diff --git a/client/src/components/Upload/Default.vue b/client/src/components/Upload/Default.vue
@@ -321,6 +321,9 @@ function uploadSelect() {
 
 defineExpose({
     addFiles,
+    counterAnnounce,
+    listExtensions,
+    showHelper,
 });
 </script>
 
@@ -367,7 +370,11 @@ defineExpose({
                     :to-posix-lines="uploadItem.toPosixLines"
                     @remove="eventRemove"
                     @input="eventInput" />
-                <div v-if="uploadValues.length > lazyLoad" v-localize class="upload-text-message">
+                <div
+                    v-if="uploadValues.length > lazyLoad"
+                    v-localize
+                    class="upload-text-message"
+                    data-description="lazyload message">
                     Only showing first {{ lazyLoad }} of {{ uploadValues.length }} entries.
                 </div>
             </div>

diff --git a/client/src/components/Upload/RulesInput.test.js b/client/src/components/Upload/RulesInput.test.js
@@ -1,16 +1,26 @@
-import { mountWithDetails } from "./testHelpers";
+import { mount } from "@vue/test-utils";
+import { getLocalVue } from "tests/jest/helpers";
 
-import RulesInput from "./RulesInput.vue";
+import mountTarget from "./RulesInput.vue";
 
-describe("RulesInput.vue", () => {
-    it("loads with correct initial state", async () => {
-        const { wrapper } = mountWithDetails(RulesInput);
-        expect(wrapper.find("#btn-reset").classes()).toEqual(expect.arrayContaining(["disabled"]));
+const localVue = getLocalVue();
+
+function getWrapper() {
+    return mount(mountTarget, {
+        propsData: {
+            fileSourcesConfigured: true,
+            ftpUploadSite: null,
+            historyId: "historyId",
+        },
+        localVue,
     });
+}
 
-    it("enables reset when sourceContent is populated", async () => {
-        const { wrapper } = mountWithDetails(RulesInput);
-        const textInput = wrapper.find(".upload-rule-source-content");
+describe("RulesInput", () => {
+    it("rendering and reset", async () => {
+        const wrapper = getWrapper();
+        expect(wrapper.find("#btn-reset").classes()).toEqual(expect.arrayContaining(["disabled"]));
+        const textInput = wrapper.find(".upload-text-area");
         expect(textInput.element.value).toBe("");
         await textInput.setValue("a b c d");
         expect(textInput.element.value).toBe("a b c d");

diff --git a/client/src/components/Upload/UploadModal.test.js b/client/src/components/Upload/UploadModal.test.js
@@ -6,10 +6,11 @@ import { useHistoryStore } from "stores/historyStore";
 import { useUserStore } from "stores/userStore";
 import { getLocalVue } from "tests/jest/helpers";
 
-import { getDatatypes, getGenomes } from "./services";
-import UploadModal from "./UploadModal";
+import { getDatatypes, getDbKeys } from "./services";
 import UploadModalContent from "./UploadModalContent";
 
+import UploadModal from "./UploadModal.vue";
+
 jest.mock("app");
 jest.mock("./services");
 jest.mock("@/schema");
@@ -36,11 +37,10 @@ const genomesResponse = [
 ];
 
 getDatatypes.mockReturnValue({ data: [fastaResponse] });
-getGenomes.mockReturnValue({ data: genomesResponse });
+getDbKeys.mockReturnValue({ data: genomesResponse });
 
 const propsData = {
     chunkUploadSize: 1024,
-    uploadPath: "/api/tools",
     fileSourcesConfigured: true,
 };
 
@@ -92,7 +92,6 @@ describe("UploadModal.vue", () => {
     });
 
     it("should fetch datatypes and parse them", async () => {
-        // lists are one layer deeper now, it won't matter after refactoring
         const contentWrapper = wrapper.findComponent(UploadModalContent);
         expect(contentWrapper.exists()).toBe(true);
         expect(contentWrapper.vm.listExtensions.length).toBe(2);
@@ -101,8 +100,7 @@ describe("UploadModal.vue", () => {
     });
 
     it("should fetch genomes and parse them", async () => {
-        // lists are one yaer deeper now, it won't matter after refactoring
         const contentWrapper = wrapper.findComponent(UploadModalContent);
-        expect(contentWrapper.vm.listGenomes.length).toBe(3);
+        expect(contentWrapper.vm.listDbKeys.length).toBe(3);
     });
 });
diff --git a/client/src/components/Upload/UploadModalContent.vue b/client/src/components/Upload/UploadModalContent.vue
@@ -150,6 +150,8 @@ onMounted(() => {
 
 defineExpose({
     immediateUpload,
+    listDbKeys,
+    listExtensions,
     toData,
 });
 </script>