diff --git a/client/galaxy/scripts/components/Citations.vue b/client/galaxy/scripts/components/Citations.vue
index e138738d76e..71d4934c72e 100644
--- a/client/galaxy/scripts/components/Citations.vue
+++ b/client/galaxy/scripts/components/Citations.vue
@@ -34,7 +34,7 @@
         <div v-else-if="citations.length">
             <b-btn v-b-toggle="id" variant="primary">Citations</b-btn>
             <b-collapse
-                :id="id"
+                :id="id.replace(/ /g, '_')"
                 class="mt-2"
                 @show="$emit('show')"
                 @shown="$emit('shown')"
diff --git a/client/galaxy/scripts/components/ToolsView/ToolsView.test.js b/client/galaxy/scripts/components/ToolsView/ToolsView.test.js
index f12b524ca8a..c7f605a02cb 100644
--- a/client/galaxy/scripts/components/ToolsView/ToolsView.test.js
+++ b/client/galaxy/scripts/components/ToolsView/ToolsView.test.js
@@ -68,7 +68,7 @@ describe("ToolsView/ToolsView.vue", () => {
             .findAll('[type="button"]')
             .filter(button => button.text() === "Citations")
             .at(0);
-        const citation = wrapper.find("#" + infoButton.attributes("aria-controls"));
+        const citation = wrapper.find("#" + infoButton.attributes("aria-controls").replace(/ /g, "_"));
 
         assert(citation.isVisible() === false, "citation is visible before being triggered!");
         assert(infoButton.attributes("aria-expanded") === "false", "citation is expanded before being triggered!");