4 files changed, 52 insertions, 2 deletions
diff --git a/spec/javascripts/notes/components/discussion_filter_spec.js b/spec/javascripts/notes/components/discussion_filter_spec.js
index a81bdf618a3..9070d968cfd 100644
--- a/spec/javascripts/notes/components/discussion_filter_spec.js
+++ b/spec/javascripts/notes/components/discussion_filter_spec.js
@@ -19,7 +19,7 @@ describe('DiscussionFilter component', () => {
       },
     ];
     const Component = Vue.extend(DiscussionFilter);
-    const defaultValue = discussionFiltersMock[0].value;
+    const selectedValue = discussionFiltersMock[0].value;
 
     store.state.discussions = discussions;
     vm = mountComponentWithStore(Component, {
@@ -27,7 +27,7 @@ describe('DiscussionFilter component', () => {
       store,
       props: {
         filters: discussionFiltersMock,
-        defaultValue,
+        selectedValue,
       },
     });
   });
@@ -63,4 +63,24 @@ describe('DiscussionFilter component', () => {
 
     expect(vm.filterDiscussion).not.toHaveBeenCalled();
   });
+
+  it('disables commenting when "Show history only" filter is applied', () => {
+    const filterItem = vm.$el.querySelector('.dropdown-menu li:last-child button');
+    filterItem.click();
+
+    expect(vm.$store.state.commentsDisabled).toBe(true);
+  });
+
+  it('enables commenting when "Show history only" filter is not applied', () => {
+    const filterItem = vm.$el.querySelector('.dropdown-menu li:first-child button');
+    filterItem.click();
+
+    expect(vm.$store.state.commentsDisabled).toBe(false);
+  });
+
+  it('renders a dropdown divider for the default filter', () => {
+    const defaultFilter = vm.$el.querySelector('.dropdown-menu li:first-child');
+
+    expect(defaultFilter.lastChild.classList).toContain('dropdown-divider');
+  });
 });
diff --git a/spec/javascripts/notes/components/note_app_spec.js b/spec/javascripts/notes/components/note_app_spec.js
index 3e289a6b8e6..0081f42c330 100644
--- a/spec/javascripts/notes/components/note_app_spec.js
+++ b/spec/javascripts/notes/components/note_app_spec.js
@@ -121,6 +121,13 @@ describe('note_app', () => {
       ).toEqual('Write a comment or drag your files here…');
     });
 
+    it('should not render form when commenting is disabled', () => {
+      store.state.commentsDisabled = true;
+      vm = mountComponent();
+
+      expect(vm.$el.querySelector('.js-main-target-form')).toEqual(null);
+    });
+
     it('should render form comment button as disabled', () => {
       expect(vm.$el.querySelector('.js-note-new-discussion').getAttribute('disabled')).toEqual(
         'disabled',
diff --git a/spec/javascripts/notes/stores/actions_spec.js b/spec/javascripts/notes/stores/actions_spec.js
index f4643fd55ed..0c0bc45b201 100644
--- a/spec/javascripts/notes/stores/actions_spec.js
+++ b/spec/javascripts/notes/stores/actions_spec.js
@@ -509,4 +509,17 @@ describe('Actions Notes Store', () => {
       expect(mrWidgetEventHub.$emit).toHaveBeenCalledWith('mr.discussion.updated');
     });
   });
+
+  describe('setCommentsDisabled', () => {
+    it('should set comments disabled state', done => {
+      testAction(
+        actions.setCommentsDisabled,
+        true,
+        null,
+        [{ type: 'DISABLE_COMMENTS', payload: true }],
+        [],
+        done,
+      );
+    });
+  });
 });
diff --git a/spec/javascripts/notes/stores/mutation_spec.js b/spec/javascripts/notes/stores/mutation_spec.js
index 380ab59099d..461de5a3106 100644
--- a/spec/javascripts/notes/stores/mutation_spec.js
+++ b/spec/javascripts/notes/stores/mutation_spec.js
@@ -427,4 +427,14 @@ describe('Notes Store mutations', () => {
       expect(state.discussions[0].expanded).toBe(true);
     });
   });
+
+  describe('DISABLE_COMMENTS', () => {
+    it('should set comments disabled state', () => {
+      const state = {};
+
+      mutations.DISABLE_COMMENTS(state, true);
+
+      expect(state.commentsDisabled).toEqual(true);
+    });
+  });
 });