Made discussion filters only visible in merge request discussions tab

Discussion filters will be hidden on Commits, Pipelines, and
Changes tabs on merge requests page.

This does not affect its behavior on issues page

1 files changed, 34 insertions, 2 deletions

diff --git a/spec/javascripts/notes/components/discussion_filter_spec.js b/spec/javascripts/notes/components/discussion_filter_spec.js
index 9070d968cfd..5efcab436e4 100644
--- a/spec/javascripts/notes/components/discussion_filter_spec.js
+++ b/spec/javascripts/notes/components/discussion_filter_spec.js
@@ -7,8 +7,9 @@ import { discussionFiltersMock, discussionMock } from '../mock_data';
 describe('DiscussionFilter component', () => {
   let vm;
   let store;
+  let eventHub;
 
-  beforeEach(() => {
+  const mountComponent = () => {
     store = createStore();
 
     const discussions = [
@@ -22,7 +23,7 @@ describe('DiscussionFilter component', () => {
     const selectedValue = discussionFiltersMock[0].value;
 
     store.state.discussions = discussions;
-    vm = mountComponentWithStore(Component, {
+    return mountComponentWithStore(Component, {
       el: null,
       store,
       props: {
@@ -30,6 +31,11 @@ describe('DiscussionFilter component', () => {
         selectedValue,
       },
     });
+  };
+
+  beforeEach(() => {
+    window.mrTabs = undefined;
+    vm = mountComponent();
   });
 
   afterEach(() => {
@@ -83,4 +89,30 @@ describe('DiscussionFilter component', () => {
 
     expect(defaultFilter.lastChild.classList).toContain('dropdown-divider');
   });
+
+  describe('Merge request tabs', () => {
+    eventHub = new Vue();
+
+    beforeEach(() => {
+      window.mrTabs = {
+        eventHub,
+        currentTab: 'show',
+      };
+
+      vm = mountComponent();
+    });
+
+    afterEach(() => {
+      window.mrTabs = undefined;
+    });
+
+    it('only renders when discussion tab is active', done => {
+      eventHub.$emit('MergeRequestTabChange', 'commit');
+
+      vm.$nextTick(() => {
+        expect(vm.$el.querySelector).toBeUndefined();
+        done();
+      });
+    });
+  });
 });