Add additional markdown container tests

client/src/components/Markdown/Elements/HistoryLink.vue

@@ -15,11 +15,11 @@
 
 <script>
 import axios from "axios";
-import { getAppRoot } from "onload/loadConfig";
 import Vue from "vue";
 import BootstrapVue from "bootstrap-vue";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { errorMessageAsString } from "utils/simple-error";
+import { safePath } from "utils/redirect";
 
 Vue.use(BootstrapVue);
 
@@ -54,7 +54,7 @@ export default {
     methods: {
         onClick() {
             axios
-                .post(`${getAppRoot()}api/histories`, { history_id: this.args.history_id })
+                .post(safePath("/api/histories"), { history_id: this.args.history_id })
                 .then(() => {
                     this.imported = true;
                 })

client/src/components/Markdown/MarkdownContainer.test.js

@@ -1,31 +1,39 @@
 import axios from "axios";
+import flushPromises from "flush-promises";
 import { mount } from "@vue/test-utils";
 import { getLocalVue } from "tests/jest/helpers";
 import MockAdapter from "axios-mock-adapter";
-import TargetComponent from "./MarkdownContainer.vue";
+import { safePath } from "utils/redirect";
+import MountTarget from "./MarkdownContainer.vue";
+
+// mock routes
+jest.mock("utils/redirect");
+safePath.mockImplementation((url) => url);
 
 const localVue = getLocalVue();
+const axiosMock = new MockAdapter(axios);
 
 async function mountComponent(propsData, apiMap = {}) {
-    const axiosMock = new MockAdapter(axios);
-    for (const [path, response] of Object.entries(apiMap)) {
-        axiosMock.onGet(path).reply(200, response);
+    axiosMock.reset();
+    for (const [method, apiDetails] of Object.entries(apiMap)) {
+        for (const [path, response] of Object.entries(apiDetails)) {
+            axiosMock[method](path).reply(200, response);
+        }
     }
-    return mount(TargetComponent, {
+    return mount(MountTarget, {
         localVue,
         propsData,
+        stubs: {
+            FontAwesomeIcon: true,
+        },
     });
 }
 
 async function testCollapse(wrapper) {
     const nolink = wrapper.find("a");
     expect(nolink.exists()).toBe(false);
     const collapse = "Click here to expand/collapse";
-    await wrapper.setProps({
-        args: {
-            collapse,
-        },
-    });
+    await wrapper.setProps({ args: { collapse } });
     const link = wrapper.find("a");
     expect(link.text()).toBe(collapse);
     const container = wrapper.find(".collapse");
@@ -35,7 +43,7 @@ async function testCollapse(wrapper) {
 }
 
 describe("MarkdownContainer", () => {
-    it("Should render version", async () => {
+    it("Renders version", async () => {
         const version = "test_version";
         const wrapper = await mountComponent({
             name: "generate_galaxy_version",
@@ -48,7 +56,7 @@ describe("MarkdownContainer", () => {
         testCollapse(wrapper);
     });
 
-    it("Should render time stamp", async () => {
+    it("Renders time stamp", async () => {
         const time = "test_time";
         const wrapper = await mountComponent({
             name: "generate_time",
@@ -60,4 +68,39 @@ describe("MarkdownContainer", () => {
         expect(version.find("code").text()).toBe(time);
         testCollapse(wrapper);
     });
+
+    it("Renders history link", async () => {
+        const wrapper = await mountComponent(
+            {
+                name: "history_link",
+                args: { history_id: "test_history_id" },
+                histories: { test_history_id: { name: "history_name" } },
+            },
+            {
+                onPost: { "/api/histories": {} },
+            }
+        );
+        const link = wrapper.find("a");
+        expect(link.text()).toBe("Click to Import History: history_name.");
+        await link.trigger("click");
+        const postedData = JSON.parse(axiosMock.history.post[0].data);
+        expect(postedData.history_id).toBe("test_history_id");
+        await flushPromises();
+        const error = wrapper.find(".text-success");
+        const message = error.find("span");
+        expect(message.text()).toBe("Successfully Imported History: history_name!");
+    });
+
+    it("Renders history link (with failing import error message)", async () => {
+        const wrapper = await mountComponent({
+            name: "history_link",
+            args: { history_id: "test_history_id" },
+            histories: { test_history_id: { name: "history_name" } },
+        });
+        await wrapper.find("a").trigger("click");
+        await flushPromises();
+        const error = wrapper.find(".text-danger");
+        const message = error.find("span");
+        expect(message.text()).toBe("Failed to Import History: history_name!");
+    });
 });