1 files changed, 96 insertions, 1 deletions
diff --git a/spec/javascripts/filtered_search/dropdown_utils_spec.js b/spec/javascripts/filtered_search/dropdown_utils_spec.js
index f55726379f3..b1b3d43f241 100644
--- a/spec/javascripts/filtered_search/dropdown_utils_spec.js
+++ b/spec/javascripts/filtered_search/dropdown_utils_spec.js
@@ -1,4 +1,3 @@
-import '~/extensions/array';
 import '~/filtered_search/dropdown_utils';
 import '~/filtered_search/filtered_search_tokenizer';
 import '~/filtered_search/filtered_search_dropdown_manager';
@@ -191,6 +190,102 @@ describe('Dropdown Utils', () => {
     });
   });
 
+  describe('mergeDuplicateLabels', () => {
+    const dataMap = {
+      label: {
+        title: 'label',
+        color: '#FFFFFF',
+      },
+    };
+
+    it('should add label to dataMap if it is not a duplicate', () => {
+      const newLabel = {
+        title: 'new-label',
+        color: '#000000',
+      };
+
+      const updated = gl.DropdownUtils.mergeDuplicateLabels(dataMap, newLabel);
+      expect(updated[newLabel.title]).toEqual(newLabel);
+    });
+
+    it('should merge colors if label is a duplicate', () => {
+      const duplicate = {
+        title: 'label',
+        color: '#000000',
+      };
+
+      const updated = gl.DropdownUtils.mergeDuplicateLabels(dataMap, duplicate);
+      expect(updated.label.multipleColors).toEqual([dataMap.label.color, duplicate.color]);
+    });
+  });
+
+  describe('duplicateLabelColor', () => {
+    it('should linear-gradient 2 colors', () => {
+      const gradient = gl.DropdownUtils.duplicateLabelColor(['#FFFFFF', '#000000']);
+      expect(gradient).toEqual('linear-gradient(#FFFFFF 0%, #FFFFFF 50%, #000000 50%, #000000 100%)');
+    });
+
+    it('should linear-gradient 3 colors', () => {
+      const gradient = gl.DropdownUtils.duplicateLabelColor(['#FFFFFF', '#000000', '#333333']);
+      expect(gradient).toEqual('linear-gradient(#FFFFFF 0%, #FFFFFF 33%, #000000 33%, #000000 66%, #333333 66%, #333333 100%)');
+    });
+
+    it('should linear-gradient 4 colors', () => {
+      const gradient = gl.DropdownUtils.duplicateLabelColor(['#FFFFFF', '#000000', '#333333', '#DDDDDD']);
+      expect(gradient).toEqual('linear-gradient(#FFFFFF 0%, #FFFFFF 25%, #000000 25%, #000000 50%, #333333 50%, #333333 75%, #DDDDDD 75%, #DDDDDD 100%)');
+    });
+
+    it('should not linear-gradient more than 4 colors', () => {
+      const gradient = gl.DropdownUtils.duplicateLabelColor(['#FFFFFF', '#000000', '#333333', '#DDDDDD', '#EEEEEE']);
+      expect(gradient.indexOf('#EEEEEE') === -1).toEqual(true);
+    });
+  });
+
+  describe('duplicateLabelPreprocessing', () => {
+    it('should set preprocessed to true', () => {
+      const results = gl.DropdownUtils.duplicateLabelPreprocessing([]);
+      expect(results.preprocessed).toEqual(true);
+    });
+
+    it('should not mutate existing data if there are no duplicates', () => {
+      const data = [{
+        title: 'label1',
+        color: '#FFFFFF',
+      }, {
+        title: 'label2',
+        color: '#000000',
+      }];
+      const results = gl.DropdownUtils.duplicateLabelPreprocessing(data);
+
+      expect(results.length).toEqual(2);
+      expect(results[0]).toEqual(data[0]);
+      expect(results[1]).toEqual(data[1]);
+    });
+
+    describe('duplicate labels', () => {
+      const data = [{
+        title: 'label',
+        color: '#FFFFFF',
+      }, {
+        title: 'label',
+        color: '#000000',
+      }];
+      const results = gl.DropdownUtils.duplicateLabelPreprocessing(data);
+
+      it('should merge duplicate labels', () => {
+        expect(results.length).toEqual(1);
+      });
+
+      it('should convert multiple colored labels into linear-gradient', () => {
+        expect(results[0].color).toEqual(gl.DropdownUtils.duplicateLabelColor(['#FFFFFF', '#000000']));
+      });
+
+      it('should set multiple colored label text color to black', () => {
+        expect(results[0].text_color).toEqual('#000000');
+      });
+    });
+  });
+
   describe('setDataValueIfSelected', () => {
     beforeEach(() => {
       spyOn(gl.FilteredSearchDropdownManager, 'addWordToInput')