Merge branch 'label-update-check-new' into 'master'

Send ajax request for label update only if they are changed

## What does this MR do?

At the moment we send requests to update the labels on issue even if nothing has been changed. This fixes that and only sends requests when something has actually been changed.

The code gets the initial selected values based on the inputs & then compares that to the selected values when submitting. If they are equal, then no request is sent.

## What are the relevant issue numbers?

Closes #19472 

See merge request !5071

4 files changed, 44 insertions, 8 deletions

diff --git a/CHANGELOG b/CHANGELOG
index 726660d8712..b6c2f749dfb 100644
--- a/CHANGELOG
+++ b/CHANGELOG
@@ -1,5 +1,15 @@
 Please view this file on the master branch, on stable branches it's out of date.
 
+v 8.13.0 (unreleased)
+  - Use gitlab-shell v3.6.2 (GIT TRACE logging)
+  - Speed-up group milestones show page
+  - Add more tests for calendar contribution (ClemMakesApps)
+  - Fix robots.txt disallowing access to groups starting with "s" (Matt Harrison)
+  - Only update issuable labels if they have been changed
+  - Revoke button in Applications Settings underlines on hover.
+  - Add organization field to user profile
+  - Optimize GitHub importing for speed and memory
+
 v 8.12.2 (unreleased)
   - Fix Import/Export not recognising correctly the imported services.
   - Fix snippets pagination
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index 3f15a117ca8..012516b2c90 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -4,7 +4,7 @@
       var _this;
       _this = this;
       $('.js-label-select').each(function(i, dropdown) {
-        var $block, $colorPreview, $dropdown, $form, $loading, $selectbox, $sidebarCollapsedValue, $value, abilityName, defaultLabel, enableLabelCreateButton, issueURLSplit, issueUpdateURL, labelHTMLTemplate, labelNoneHTMLTemplate, labelUrl, projectId, saveLabelData, selectedLabel, showAny, showNo, $sidebarLabelTooltip;
+        var $block, $colorPreview, $dropdown, $form, $loading, $selectbox, $sidebarCollapsedValue, $value, abilityName, defaultLabel, enableLabelCreateButton, issueURLSplit, issueUpdateURL, labelHTMLTemplate, labelNoneHTMLTemplate, labelUrl, projectId, saveLabelData, selectedLabel, showAny, showNo, $sidebarLabelTooltip, initialSelected;
         $dropdown = $(dropdown);
         projectId = $dropdown.data('project-id');
         labelUrl = $dropdown.data('labels');
@@ -24,6 +24,11 @@
         $sidebarLabelTooltip = $block.find('.js-sidebar-labels-tooltip');
         $value = $block.find('.value');
         $loading = $block.find('.block-loading').fadeOut();
+        initialSelected = $selectbox
+          .find('input[name="' + $dropdown.data('field-name') + '"]')
+          .map(function () {
+            return this.value;
+          }).get();
         if (issueUpdateURL != null) {
           issueURLSplit = issueUpdateURL.split('/');
         }
@@ -43,6 +48,10 @@
           selected = $dropdown.closest('.selectbox').find("input[name='" + ($dropdown.data('field-name')) + "']").map(function() {
             return this.value;
           }).get();
+
+          if (_.isEqual(initialSelected, selected)) return;
+          initialSelected = selected;
+
           data = {};
           data[abilityName] = {};
           data[abilityName].label_ids = selected;
diff --git a/spec/features/issues_spec.rb b/spec/features/issues_spec.rb
index 22359c8f938..9fe40ea0892 100644
--- a/spec/features/issues_spec.rb
+++ b/spec/features/issues_spec.rb
@@ -369,6 +369,24 @@ describe 'Issues', feature: true do
     end
   end
 
+  describe 'update labels from issue#show', js: true do
+    let(:issue) { create(:issue, project: project, author: @user, assignee: @user) }
+    let!(:label) { create(:label, project: project) }
+
+    before do
+      visit namespace_project_issue_path(project.namespace, project, issue)
+    end
+
+    it 'will not send ajax request when no data is changed' do
+      page.within '.labels' do
+        click_link 'Edit'
+        first('.dropdown-menu-close').click
+
+        expect(page).not_to have_selector('.block-loading')
+      end
+    end
+  end
+
   describe 'update assignee from issue#show' do
     let(:issue) { create(:issue, project: project, author: @user, assignee: @user) }
 
diff --git a/spec/javascripts/labels_issue_sidebar_spec.js.es6 b/spec/javascripts/labels_issue_sidebar_spec.js.es6
index 840c7b6d015..1ad6f612210 100644
--- a/spec/javascripts/labels_issue_sidebar_spec.js.es6
+++ b/spec/javascripts/labels_issue_sidebar_spec.js.es6
@@ -48,9 +48,9 @@
       setTimeout(() => {
         expect($('.dropdown-content a').length).toBe(10);
 
-        $('.dropdow-content a').each((i, $link) => {
-          if (i < 5) {
-            $link.get(0).click();
+        $('.dropdown-content a').each(function (i) {
+          if (i < saveLabelCount) {
+            $(this).get(0).click();
           }
         });
 
@@ -70,9 +70,9 @@
       setTimeout(() => {
         expect($('.dropdown-content a').length).toBe(10);
 
-        $('.dropdow-content a').each((i, $link) => {
-          if (i < 5) {
-            $link.get(0).click();
+        $('.dropdown-content a').each(function (i) {
+          if (i < saveLabelCount) {
+            $(this).get(0).click();
           }
         });
 
@@ -86,4 +86,3 @@
     });
   });
 })();
-