From f01e34df3ffc4e38c51b23c0c62b04d25c7b3696 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Mon, 14 Aug 2017 14:52:04 +0100
Subject: Stops propagation for dropdown content in pipeline graph. Applies the
 same behavior of the mini graph

---
 .../components/graph/dropdown_job_component.vue     | 21 +++++++++++++++++++++
 .../unreleased/36385-pipeline-graph-dropdown.yml    |  5 +++++
 2 files changed, 26 insertions(+)
 create mode 100644 changelogs/unreleased/36385-pipeline-graph-dropdown.yml

diff --git a/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue b/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue
index 2944689a5a7..7695b04db74 100644
--- a/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue
@@ -48,6 +48,27 @@
         return `${this.job.name} - ${this.job.status.label}`;
       },
     },
+
+    methods: {
+      /**
+     * When the user right clicks or cmd/ctrl + click in the job name
+     * the dropdown should not be closed and the link should open in another tab,
+     * so we stop propagation of the click event inside the dropdown.
+     *
+     * Since this component is rendered multiple times per page we need to guarantee we only
+     * target the click event of this component.
+     */
+      stopDropdownClickPropagation() {
+        $(this.$el.querySelectorAll('.js-grouped-pipeline-dropdown a.mini-pipeline-graph-dropdown-item'))
+          .on('click', (e) => {
+            e.stopPropagation();
+          });
+      },
+    },
+
+    mounted() {
+      this.stopDropdownClickPropagation();
+    },
   };
 </script>
 <template>
diff --git a/changelogs/unreleased/36385-pipeline-graph-dropdown.yml b/changelogs/unreleased/36385-pipeline-graph-dropdown.yml
new file mode 100644
index 00000000000..1a43c66debd
--- /dev/null
+++ b/changelogs/unreleased/36385-pipeline-graph-dropdown.yml
@@ -0,0 +1,5 @@
+---
+title: Prevents jobs dropdown from closing in pipeline graph
+merge_request:
+author:
+type: fixed
-- 
cgit v1.2.1