Fixed issue with filtering by label on issue not updating dropdown

5 files changed, 73 insertions, 11 deletions

diff --git a/app/assets/javascripts/boards/components/board_card.js.es6 b/app/assets/javascripts/boards/components/board_card.js.es6
index 0b7ac62892e..fb637269b38 100644
--- a/app/assets/javascripts/boards/components/board_card.js.es6
+++ b/app/assets/javascripts/boards/components/board_card.js.es6
@@ -7,15 +7,28 @@
     },
     methods: {
       filterByLabel: function (label, $event) {
+        let labelToggleText = label.title;
         const labelIndex = BoardsStore.state.filters['label_name'].indexOf(label.title);
-        // $($event.target).tooltip('hide');
+        $($event.target).tooltip('hide');
 
         if (labelIndex === -1) {
           BoardsStore.state.filters['label_name'].push(label.title);
+          $('.labels-filter').prepend(`<input type="hidden" name="label_name[]" value="${label.title}" />`);
         } else {
           BoardsStore.state.filters['label_name'].splice(labelIndex, 1);
+          labelToggleText = BoardsStore.state.filters['label_name'][0];
+          $(`.labels-filter input[name="label_name[]"][value="${label.title}"]`).remove();
         }
 
+        const selectedLabels = BoardsStore.state.filters['label_name'];
+        if (selectedLabels.length === 0) {
+          labelToggleText = 'Label';
+        } else if (selectedLabels.length > 1) {
+          labelToggleText = `${selectedLabels[0]} + ${selectedLabels.length - 1} more`;
+        }
+
+        $('.labels-filter .dropdown-toggle-text').text(labelToggleText);
+
         BoardsStore.updateFiltersUrl();
       }
     }
diff --git a/app/assets/javascripts/boards/components/board_delete.js.es6 b/app/assets/javascripts/boards/components/board_delete.js.es6
index 4b21db69b32..fdd408c14ee 100644
--- a/app/assets/javascripts/boards/components/board_delete.js.es6
+++ b/app/assets/javascripts/boards/components/board_delete.js.es6
@@ -4,7 +4,8 @@
       list: Object
     },
     methods: {
-      deleteBoard: function () {
+      deleteBoard: function (e) {
+        e.stopImmediatePropagation();
         $(this.$el).tooltip('hide');
 
         if (confirm('Are you sure you want to delete this list?')) {
diff --git a/app/assets/javascripts/boards/stores/boards_store.js.es6 b/app/assets/javascripts/boards/stores/boards_store.js.es6
index e4d3d2cff2f..4eb8d9c500a 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js.es6
+++ b/app/assets/javascripts/boards/stores/boards_store.js.es6
@@ -31,11 +31,14 @@
       this.removeBlankState();
     },
     updateNewListDropdown: function () {
-      let data = $('.js-new-board-list').data('glDropdown');
+      const glDropdown = $('.js-new-board-list').data('glDropdown');
 
-      if (data) {
-        data = data.renderedData;
-        $('.js-new-board-list').data('glDropdown').renderData(data);
+      if (glDropdown) {
+        const renderedData = glDropdown.renderedData;
+
+        if (renderedData) {
+          glDropdown.renderData(renderedData);
+        }
       }
     },
     shouldAddBlankState: function () {
diff --git a/app/assets/javascripts/copy_to_clipboard.js b/app/assets/javascripts/copy_to_clipboard.js
index 3b79331ac6e..c43af17442b 100644
--- a/app/assets/javascripts/copy_to_clipboard.js
+++ b/app/assets/javascripts/copy_to_clipboard.js
@@ -35,11 +35,9 @@
   $(function() {
     var clipboard;
 
-    if ($('body').attr('data-page') !== 'projects:boards:show') {
-      clipboard = new Clipboard('[data-clipboard-target], [data-clipboard-text]');
-      clipboard.on('success', genericSuccess);
-      return clipboard.on('error', genericError);
-    }
+    clipboard = new Clipboard('[data-clipboard-target], [data-clipboard-text]');
+    clipboard.on('success', genericSuccess);
+    return clipboard.on('error', genericError);
   });
 
 }).call(this);
diff --git a/spec/features/boards/boards_spec.rb b/spec/features/boards/boards_spec.rb
index 91b9bdb3bf0..1f681bd3873 100644
--- a/spec/features/boards/boards_spec.rb
+++ b/spec/features/boards/boards_spec.rb
@@ -376,6 +376,53 @@ describe 'Issue Boards', feature: true, js: true do
           expect(page).to have_selector('.card', count: 0)
         end
       end
+
+      it 'filters by clicking label button on issue' do
+        page.within '.issues-filters' do
+          click_button('Label')
+
+          page.within '.dropdown-menu-labels' do
+            click_link(bug.title)
+            find('.dropdown-menu-close').click
+          end
+        end
+
+        page.within(first('.board')) do
+          expect(page.find('.board-header')).to have_content('1')
+          expect(page).to have_selector('.card', count: 1)
+        end
+
+        page.within(all('.board')[1]) do
+          expect(page.find('.board-header')).to have_content('0')
+          expect(page).to have_selector('.card', count: 0)
+        end
+
+        page.within(first('.board')) do
+          page.within(first('.card')) do
+            click_button(bug.title)
+          end
+
+          expect(page).to have_selector('.card', count: 5)
+        end
+
+        page.within('.labels-filter') do
+          expect(find('.dropdown-toggle-text')).not_to have_content(bug.title)
+        end
+      end
+
+      it 'removes label filter by clicking label button on issue' do
+        page.within(first('.board')) do
+          page.within(first('.card')) do
+            click_button(bug.title)
+          end
+
+          expect(page).to have_selector('.card', count: 1)
+        end
+
+        page.within('.labels-filter') do
+          expect(find('.dropdown-toggle-text')).to have_content(bug.title)
+        end
+      end
     end
   end