Async notification subscriptions in issue boards

4 files changed, 49 insertions, 16 deletions

diff --git a/spec/features/boards/sidebar_spec.rb b/spec/features/boards/sidebar_spec.rb
index 9137ab82ff4..205900615c4 100644
--- a/spec/features/boards/sidebar_spec.rb
+++ b/spec/features/boards/sidebar_spec.rb
@@ -331,11 +331,29 @@ describe 'Issue Boards', :js do
   context 'subscription' do
     it 'changes issue subscription' do
       click_card(card)
+      wait_for_requests
 
-      page.within('.subscription') do
+      page.within('.subscriptions') do
         click_button 'Subscribe'
         wait_for_requests
-        expect(page).to have_content("Unsubscribe")
+
+        expect(page).to have_content('Unsubscribe')
+      end
+    end
+
+    it 'has "Unsubscribe" button when already subscribed' do
+      create(:subscription, user: user, project: project, subscribable: issue2, subscribed: true)
+      visit project_board_path(project, board)
+      wait_for_requests
+
+      click_card(card)
+      wait_for_requests
+
+      page.within('.subscriptions') do
+        click_button 'Unsubscribe'
+        wait_for_requests
+
+        expect(page).to have_content('Subscribe')
       end
     end
   end
diff --git a/spec/javascripts/boards/board_card_spec.js b/spec/javascripts/boards/board_card_spec.js
index 83b13b06dc1..8f607899b20 100644
--- a/spec/javascripts/boards/board_card_spec.js
+++ b/spec/javascripts/boards/board_card_spec.js
@@ -9,10 +9,11 @@
 import Vue from 'vue';
 import '~/boards/models/assignee';
 
+import eventHub from '~/boards/eventhub';
 import '~/boards/models/list';
 import '~/boards/models/label';
 import '~/boards/stores/boards_store';
-import boardCard from '~/boards/components/board_card';
+import boardCard from '~/boards/components/board_card.vue';
 import './mock_data';
 
 describe('Board card', () => {
@@ -157,33 +158,35 @@ describe('Board card', () => {
     });
 
     it('sets detail issue to card issue on mouse up', () => {
+      spyOn(eventHub, '$emit');
+
       triggerEvent('mousedown');
       triggerEvent('mouseup');
 
-      expect(gl.issueBoards.BoardsStore.detail.issue).toEqual(vm.issue);
+      expect(eventHub.$emit).toHaveBeenCalledWith('newDetailIssue', vm.issue);
       expect(gl.issueBoards.BoardsStore.detail.list).toEqual(vm.list);
     });
 
     it('adds active class if detail issue is set', (done) => {
-      triggerEvent('mousedown');
-      triggerEvent('mouseup');
-
-      setTimeout(() => {
-        expect(vm.$el.classList.contains('is-active')).toBe(true);
-        done();
-      }, 0);
+      vm.detailIssue.issue = vm.issue;
+
+      Vue.nextTick()
+        .then(() => {
+          expect(vm.$el.classList.contains('is-active')).toBe(true);
+        })
+        .then(done)
+        .catch(done.fail);
     });
 
     it('resets detail issue to empty if already set', () => {
-      triggerEvent('mousedown');
-      triggerEvent('mouseup');
+      spyOn(eventHub, '$emit');
 
-      expect(gl.issueBoards.BoardsStore.detail.issue).toEqual(vm.issue);
+      gl.issueBoards.BoardsStore.detail.issue = vm.issue;
 
       triggerEvent('mousedown');
       triggerEvent('mouseup');
 
-      expect(gl.issueBoards.BoardsStore.detail.issue).toEqual({});
+      expect(eventHub.$emit).toHaveBeenCalledWith('clearDetailIssue');
     });
   });
 });
diff --git a/spec/javascripts/boards/issue_spec.js b/spec/javascripts/boards/issue_spec.js
index 022d286d5df..ccde657789a 100644
--- a/spec/javascripts/boards/issue_spec.js
+++ b/spec/javascripts/boards/issue_spec.js
@@ -133,6 +133,19 @@ describe('Issue model', () => {
     expect(relativePositionIssue.position).toBe(1);
   });
 
+  it('updates data', () => {
+    issue.updateData({ subscribed: true });
+    expect(issue.subscribed).toBe(true);
+  });
+
+  it('sets fetching state', () => {
+    expect(issue.isFetching.subscriptions).toBe(true);
+
+    issue.setFetchingState('subscriptions', false);
+
+    expect(issue.isFetching.subscriptions).toBe(false);
+  });
+
   describe('update', () => {
     it('passes assignee ids when there are assignees', (done) => {
       spyOn(Vue.http, 'patch').and.callFake((url, data) => {
diff --git a/spec/javascripts/vue_shared/components/loading_button_spec.js b/spec/javascripts/vue_shared/components/loading_button_spec.js
index c1eabdede00..49bf8ee6f7c 100644
--- a/spec/javascripts/vue_shared/components/loading_button_spec.js
+++ b/spec/javascripts/vue_shared/components/loading_button_spec.js
@@ -98,7 +98,6 @@ describe('LoadingButton', function () {
     it('does not call given callback when disabled because of loading', () => {
       vm = mountComponent(LoadingButton, {
         loading: true,
-        indeterminate: true,
       });
       spyOn(vm, '$emit');