From c38501e2a973e95b1c1e6115d796faa07d7b1239 Mon Sep 17 00:00:00 2001
From: guerler <aysam.guerler@gmail.com>
Date: Wed, 23 Aug 2023 14:05:11 +0200
Subject: [PATCH] Fix and add test case for linked/unlinked batch mode
 selection

---
 .../Form/Elements/FormData/FormData.test.js   | 35 +++++++++++++++++++
 .../Form/Elements/FormData/FormData.vue       |  6 ++--
 2 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/client/src/components/Form/Elements/FormData/FormData.test.js b/client/src/components/Form/Elements/FormData/FormData.test.js
index c77f3dd02682..cb6254395305 100644
--- a/client/src/components/Form/Elements/FormData/FormData.test.js
+++ b/client/src/components/Form/Elements/FormData/FormData.test.js
@@ -224,4 +224,39 @@ describe("FormData", () => {
             values: [{ id: "hda2", map_over_type: null, src: "hda" }],
         });
     });
+
+    it("linked and unlinked batch mode handling", async () => {
+        const wrapper = createTarget({
+            value: null,
+            flavor: "module",
+            options: defaultOptions,
+        });
+        expect(wrapper.emitted().input[0][0]).toEqual({
+            batch: false,
+            product: false,
+            values: [{ id: "hda3", map_over_type: null, src: "hda" }],
+        });
+        const noCheckLinked = wrapper.find("input[type='checkbox']");
+        expect(noCheckLinked.exists()).toBeFalsy();
+        await wrapper.find("[title='Multiple datasets'").trigger("click");
+        expect(wrapper.emitted().input[1][0]).toEqual({
+            batch: true,
+            product: false,
+            values: [{ id: "hda3", map_over_type: null, src: "hda" }],
+        });
+        const checkLinked = wrapper.find("input[type='checkbox']");
+        expect(wrapper.find(".custom-switch span").text()).toBe(
+            "Linked: Datasets will be run in matched order with other datasets."
+        );
+        expect(checkLinked.element.checked).toBeTruthy();
+        await checkLinked.setChecked(false);
+        expect(wrapper.find(".custom-switch span").text()).toBe(
+            "Unlinked: Dataset will be run against *all* other datasets."
+        );
+        expect(wrapper.emitted().input[2][0]).toEqual({
+            batch: true,
+            product: true,
+            values: [{ id: "hda3", map_over_type: null, src: "hda" }],
+        });
+    });
 });
diff --git a/client/src/components/Form/Elements/FormData/FormData.vue b/client/src/components/Form/Elements/FormData/FormData.vue
index 234b68b5ef08..5234b6577d5b 100644
--- a/client/src/components/Form/Elements/FormData/FormData.vue
+++ b/client/src/components/Form/Elements/FormData/FormData.vue
@@ -425,7 +425,7 @@ onMounted(() => {
  * Watch and set current value if user switches to a different select field
  */
 watch(
-    () => currentVariant.value,
+    () => [currentLinked.value, currentVariant.value],
     () => {
         setValue(currentValue.value);
     }
@@ -480,11 +480,11 @@ watch(
                     v-model="currentLinked"
                     class="no-highlight my-2"
                     switch>
-                    <div v-if="currentLinked">
+                    <span v-if="currentLinked">
                         <FontAwesomeIcon icon="fa-link" />
                         <b v-localize class="mr-1">Linked:</b>
                         <span v-localize>Datasets will be run in matched order with other datasets.</span>
-                    </div>
+                    </span>
                     <span v-else>
                         <FontAwesomeIcon icon="fa-unlink" />
                         <b v-localize class="mr-1">Unlinked:</b>