Merge pull request #19186 from jmchilton/testing_24.2_5

Cleanup Jest Test Output (part 4)

client/src/app/monitor.js

@@ -27,7 +27,9 @@ if (!window.Galaxy) {
         },
     });
 } else {
-    console.debug("Skipping, window.Galaxy already exists.", serverPath());
+    if (process.env.NODE_ENV != "test") {
+        console.debug("Skipping, window.Galaxy already exists.", serverPath());
+    }
 }
 
 export default window.Galaxy;

client/src/components/Common/FilterMenu.test.ts

@@ -2,13 +2,16 @@ import { createTestingPinia } from "@pinia/testing";
 import { getLocalVue } from "@tests/jest/helpers";
 import { mount, type Wrapper } from "@vue/test-utils";
 
+import { useServerMock } from "@/api/client/__mocks__";
 import { HistoryFilters } from "@/components/History/HistoryFilters";
 import { setupSelectableMock } from "@/components/ObjectStore/mockServices";
 import { WorkflowFilters } from "@/components/Workflow/List/WorkflowFilters";
 import Filtering, { compare, contains, equals, toBool, toDate } from "@/utils/filtering";
 
 import FilterMenu from "./FilterMenu.vue";
 
+const { server, http } = useServerMock();
+
 setupSelectableMock();
 
 const localVue = getLocalVue();
@@ -72,6 +75,22 @@ const TestFilters = new Filtering(validTestFilters, undefined);
 describe("FilterMenu", () => {
     let wrapper: Wrapper<Vue>;
 
+    beforeEach(() => {
+        server.use(
+            http.get("/api/users/{user_id}/usage", ({ response }) => {
+                return response(200).json([
+                    {
+                        quota: null,
+                        quota_bytes: null,
+                        quota_percent: null,
+                        quota_source_label: null,
+                        total_disk_usage: 4,
+                    },
+                ]);
+            })
+        );
+    });
+
     function setUpWrapper(name: string, placeholder: string, filterClass: Filtering<unknown>) {
         wrapper = mount(FilterMenu as object, {
             propsData: {

client/src/components/Common/RDMDestinationSelector.test.ts

@@ -70,8 +70,6 @@ describe("RDMDestinationSelector", () => {
 
             const emitted = wrapper.emitted("onRecordSelected");
 
-            console.log("EMITTED", emitted);
-
             expect(emitted).toBeTruthy();
             expect(emitted?.at(0)[0]).toEqual(FAKE_ENTRY.uri);
         });

client/src/components/ConfigTemplates/InstanceForm.test.ts

@@ -17,6 +17,8 @@ describe("InstanceForm", () => {
                 title: "MY FORM",
                 inputs: null,
                 submitTitle: SUBMIT_TITLE,
+                busy: false,
+                loadingMessage: "loading plugin instance",
             },
             localVue,
         });
@@ -31,6 +33,8 @@ describe("InstanceForm", () => {
                 title: "MY FORM",
                 inputs: inputs,
                 submitTitle: SUBMIT_TITLE,
+                busy: false,
+                loadingMessage: "loading plugin instance",
             },
             localVue,
         });

client/src/components/ConfigTemplates/VaultSecret.vue

@@ -1,9 +1,14 @@
 <script setup lang="ts">
+import { library } from "@fortawesome/fontawesome-svg-core";
+import { faPen } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BButton, BFormInput, BInputGroup, BInputGroupAppend } from "bootstrap-vue";
 import { computed, ref } from "vue";
 
 import { markup } from "@/components/ObjectStore/configurationMarkdown";
 
+library.add(faPen);
+
 interface Props {
     name: string;
     label: string;
@@ -43,7 +48,7 @@ async function onOk() {
                         <BFormInput type="password" value="*****************************" disabled @click="onClick" />
                         <BInputGroupAppend>
                             <BButton @click="onClick">
-                                <icon icon="edit" />
+                                <FontAwesomeIcon :icon="faPen" />
                                 Update
                             </BButton>
                         </BInputGroupAppend>

client/src/components/DataDialog/DataDialog.test.js

@@ -134,6 +134,9 @@ describe("DataDialog.vue", () => {
         wrapper = shallowMount(DataDialog, {
             propsData: mockOptions,
             localVue,
+            stubs: {
+                Icon: true,
+            },
         });
         expect(wrapper.findComponent(SelectionDialog).exists()).toBe(true);
         // Cannot get nested slot templates to render into the wrapper

client/src/components/DatasetInformation/DatasetInformation.test.ts

@@ -73,6 +73,8 @@ describe("DatasetInformation/DatasetInformation", () => {
 
         // should contain 11 rows
         expect(rows.length).toBe(11);
+
+        await flushPromises();
     });
 
     it("file size should be formatted", async () => {
@@ -88,6 +90,8 @@ describe("DatasetInformation/DatasetInformation", () => {
         const formattedDate = format(parsedDate, "eeee MMM do H:mm:ss yyyy zz");
 
         expect(date).toBe(formattedDate);
+
+        await flushPromises();
     });
 
     it("Table should render data accordingly", async () => {
@@ -108,5 +112,7 @@ describe("DatasetInformation/DatasetInformation", () => {
                 expect(renderedText).toBe(datasetResponse[entry.backend_key].toString());
             }
         });
+
+        await flushPromises();
     });
 });

client/src/components/FilesDialog/FilesDialog.test.ts

@@ -1,7 +1,7 @@
 import { createTestingPinia } from "@pinia/testing";
 import { mount, type Wrapper } from "@vue/test-utils";
 import flushPromises from "flush-promises";
-import { getLocalVue } from "tests/jest/helpers";
+import { getLocalVue, suppressDebugConsole } from "tests/jest/helpers";
 
 import { useServerMock } from "@/api/client/__mocks__";
 import { SELECTION_STATES, type SelectionItem, type SelectionState } from "@/components/SelectionDialog/selectionTypes";
@@ -73,6 +73,7 @@ const mockedOkApiRoutesMap = new Map<string, RemoteFilesList>([
         paramsToKey({ target: "gxfiles://pdb-gzip/directory1/subdirectory1", recursive: "false" }),
         subsubdirectoryResponse,
     ],
+    [paramsToKey({ target: "gxftp://", recursive: "false" }), pdbResponse],
 ]);
 
 const mockedErrorApiRoutesMap = new Map<string, RemoteFilesList>([
@@ -231,6 +232,8 @@ describe("FilesDialog, file mode", () => {
     it("should show loading error and can return back when there is an error", async () => {
         utils.expectNoErrorMessage();
 
+        suppressDebugConsole(); // expecting error message.
+
         // open directory with error
         await utils.openDirectoryById("empty-dir");
         utils.expectErrorMessage();
@@ -274,6 +277,8 @@ describe("FilesDialog, directory mode", () => {
     it("should show loading error and can return back when there is an error", async () => {
         utils.expectNoErrorMessage();
 
+        suppressDebugConsole(); // expecting error message.
+
         // open directory with error
         await utils.openDirectoryById("empty-dir");
         utils.expectErrorMessage();

client/src/components/History/CurrentHistory/HistoryOperations/SelectionOperations.test.js

@@ -1,7 +1,8 @@
 import { shallowMount } from "@vue/test-utils";
 import flushPromises from "flush-promises";
 import { createPinia } from "pinia";
-import { getLocalVue } from "tests/jest/helpers";
+import { getLocalVue, suppressDebugConsole } from "tests/jest/helpers";
+import { setupMockConfig } from "tests/jest/mockConfig";
 
 import { useServerMock } from "@/api/client/__mocks__";
 
@@ -32,11 +33,7 @@ const getDeletedSelection = () => new Map([["FAKE_ID", { deleted: true }]]);
 const getActiveSelection = () => new Map([["FAKE_ID", { deleted: false }]]);
 
 async function mountSelectionOperationsWrapper(config) {
-    server.use(
-        http.get("/api/configuration", ({ response }) => {
-            return response(200).json(config);
-        })
-    );
+    setupMockConfig(config);
 
     const pinia = createPinia();
     const wrapper = shallowMount(SelectionOperations, {
@@ -269,6 +266,7 @@ describe("History Selection Operations", () => {
             });
 
             it("should update operation-running state to null when the operation fails", async () => {
+                suppressDebugConsole(); // expected error messages since we're testing errors.
                 server.use(
                     http.put("/api/histories/{history_id}/contents/bulk", ({ response }) => {
                         return response("4XX").json({ err_msg: "Error", err_code: 400 }, { status: 400 });
@@ -290,6 +288,8 @@ describe("History Selection Operations", () => {
             });
 
             it("should emit operation error event when the operation fails", async () => {
+                suppressDebugConsole(); // expected error messages since we're testing errors.
+
                 server.use(
                     http.put("/api/histories/{history_id}/contents/bulk", ({ response }) => {
                         return response("4XX").json({ err_msg: "Error", err_code: 400 }, { status: 400 });

client/src/components/History/Export/HistoryExport.test.ts

@@ -1,5 +1,5 @@
 import { createTestingPinia } from "@pinia/testing";
-import { getLocalVue } from "@tests/jest/helpers";
+import { getLocalVue, suppressDebugConsole } from "@tests/jest/helpers";
 import { shallowMount } from "@vue/test-utils";
 import flushPromises from "flush-promises";
 import { setActivePinia } from "pinia";
@@ -164,6 +164,8 @@ describe("HistoryExport.vue", () => {
     });
 
     it("should not display a fatal error alert if the history is found and loaded", async () => {
+        suppressDebugConsole(); // we rightfully debug message the fact we don't have a history in this test
+
         const wrapper = await mountHistoryExport();
 
         expect(wrapper.find("#fatal-error-alert").exists()).toBe(false);

client/src/components/History/HistoryView.test.js

@@ -3,6 +3,7 @@ import { mount } from "@vue/test-utils";
 import flushPromises from "flush-promises";
 import { createPinia } from "pinia";
 import { getLocalVue } from "tests/jest/helpers";
+import { setupMockConfig } from "tests/jest/mockConfig";
 
 import { useServerMock } from "@/api/client/__mocks__";
 import { useHistoryStore } from "@/stores/historyStore";
@@ -70,11 +71,8 @@ async function createWrapper(localVue, currentUserId, history) {
     setCurrentHistoryOnServer.mockResolvedValue(history);
     const history_contents_result = create_datasets(history.id, history.count);
 
+    setupMockConfig({});
     server.use(
-        http.get("/api/configuration", ({ response }) => {
-            return response(200).json({});
-        }),
-
         http.get("/api/histories/{history_id}/contents", ({ response }) => {
             return response(200).json(history_contents_result);
         })

client/src/components/Tool/ToolCard.test.js

@@ -4,7 +4,7 @@ import MockAdapter from "axios-mock-adapter";
 import flushPromises from "flush-promises";
 import { createPinia } from "pinia";
 import { useUserStore } from "stores/userStore";
-import { getLocalVue } from "tests/jest/helpers";
+import { expectConfigurationRequest, getLocalVue } from "tests/jest/helpers";
 import { setupMockConfig } from "tests/jest/mockConfig";
 
 import { useServerMock } from "@/api/client/__mocks__";
@@ -29,11 +29,7 @@ describe("ToolCard", () => {
         // some child component must be bypassing useConfig - so we need to explicitly
         // stup the API endpoint also. If you can drop this without request problems in log,
         // this hack can be removed.
-        server.use(
-            http.get("/api/configuration", ({ response }) => {
-                return response(200).json(config);
-            })
-        );
+        server.use(expectConfigurationRequest(http, {}));
         axiosMock = new MockAdapter(axios);
         axiosMock.onGet(`/api/webhooks`).reply(200, []);
 

client/src/components/Workflow/Editor/Node.test.ts

@@ -14,6 +14,12 @@ jest.mock("app");
 
 const localVue = getLocalVue();
 
+const MOCK_SCROLL = {
+    x: { value: 100 },
+    y: { value: 200 },
+    isScrolling: { value: true },
+};
+
 describe("Node", () => {
     it("test attributes", async () => {
         const testingPinia = createTestingPinia();
@@ -27,6 +33,7 @@ describe("Node", () => {
                 step: { type: "tool", inputs: [], outputs: [], position: { top: 0, left: 0 } },
                 datatypesMapper: testDatatypesMapper,
                 rootOffset: mockOffset,
+                scroll: MOCK_SCROLL,
             },
             localVue,
             pinia: testingPinia,

client/src/components/Workflow/Editor/modules/terminals.test.ts

@@ -25,6 +25,7 @@ import {
     InputParameterTerminal,
     InputTerminal,
     InvalidOutputTerminal,
+    NO_COLLECTION_TYPE_INFORMATION_MESSAGE,
     OutputCollectionTerminal,
     OutputParameterTerminal,
     OutputTerminal,
@@ -50,6 +51,17 @@ function useStores(id = "mock-workflow") {
     };
 }
 
+// Suppress debug messages about node configurations, we're testing esoteric things here -
+// we might want these messages at runtime to help debug complex things but we don't need it
+// during unit testing.
+jest.spyOn(console, "debug").mockImplementation(
+    jest.fn((msg) => {
+        if (msg != NO_COLLECTION_TYPE_INFORMATION_MESSAGE) {
+            console.debug(msg);
+        }
+    })
+);
+
 function setupAdvanced() {
     const terminals: { [index: string]: { [index: string]: ReturnType<typeof terminalFactory> } } = {};
 

client/src/components/Workflow/Editor/modules/terminals.ts

@@ -21,6 +21,9 @@ import {
     NULL_COLLECTION_TYPE_DESCRIPTION,
 } from "./collectionTypeDescription";
 
+export const NO_COLLECTION_TYPE_INFORMATION_MESSAGE =
+    "No collection type or collection type source defined - this is fine but may lead to less intuitive connection logic.";
+
 export class ConnectionAcceptable {
     reason: string | null;
     canAccept: boolean;
@@ -757,7 +760,7 @@ export class OutputCollectionTerminal extends BaseOutputTerminal {
         } else {
             this.collectionTypeSource = attr.collection_type_source;
             if (!this.collectionTypeSource) {
-                console.log("Warning: No collection type or collection type source defined.");
+                console.debug(NO_COLLECTION_TYPE_INFORMATION_MESSAGE);
             }
             this.collectionType = this.getCollectionTypeFromInput() || ANY_COLLECTION_TYPE_DESCRIPTION;
         }

client/src/components/Workflow/Import/FromFileOrUrl.test.ts

@@ -9,6 +9,7 @@ jest.mock("axios", () => ({
     post: jest.fn((_url, request) => {
         lastPostRequest = request;
     }),
+    isAxiosError: jest.fn(() => true),
 }));
 
 const localVue = getLocalVue(true);

client/src/components/admin/Notifications/NotificationForm.test.ts

@@ -5,9 +5,13 @@ import flushPromises from "flush-promises";
 import { setActivePinia } from "pinia";
 import type Vue from "vue";
 
+import { useServerMock } from "@/api/client/__mocks__";
+
 import NotificationForm from "./NotificationForm.vue";
 
-jest.mock("@/api/schema");
+// Even though we don't use the API endpoints, this seems to prevent failure fetching
+// openapi during jest testing.
+useServerMock();
 
 const SUBMIT_BUTTON_SELECTOR = "#notification-submit";
 
@@ -46,5 +50,7 @@ describe("NotificationForm.vue", () => {
         const { wrapper } = await mountNotificationForm();
 
         expectSubmitButton(wrapper, false);
+
+        await flushPromises();
     });
 });

client/src/composables/shortTermStorageMonitor.test.ts

@@ -1,4 +1,5 @@
 import flushPromises from "flush-promises";
+import { suppressDebugConsole } from "tests/jest/helpers";
 
 import { useServerMock } from "@/api/client/__mocks__";
 import { useShortTermStorageMonitor } from "@/composables/shortTermStorageMonitor";
@@ -52,6 +53,8 @@ describe("useShortTermStorageMonitor", () => {
     });
 
     it("should indicate the task status request failed when the request failed", async () => {
+        suppressDebugConsole(); // expected API failure
+
         const { waitForTask, requestHasFailed, isRunning, isCompleted, taskStatus } = useShortTermStorageMonitor();
 
         expect(requestHasFailed.value).toBe(false);
@@ -90,6 +93,8 @@ describe("useShortTermStorageMonitor", () => {
         });
 
         it("should indicate is final state when the task has failed", async () => {
+            suppressDebugConsole(); // expected API failure
+
             const { waitForTask, isFinalState, isRunning, isCompleted, hasFailed, taskStatus } =
                 useShortTermStorageMonitor();