Add latest changes from gitlab-org/gitlab@master

3 files changed, 120 insertions, 31 deletions

diff --git a/spec/frontend/error_tracking/components/error_tracking_list_spec.js b/spec/frontend/error_tracking/components/error_tracking_list_spec.js
index 776ce589cff..9ec3d42f0d4 100644
--- a/spec/frontend/error_tracking/components/error_tracking_list_spec.js
+++ b/spec/frontend/error_tracking/components/error_tracking_list_spec.js
@@ -1,7 +1,6 @@
 import { createLocalVue, shallowMount } from '@vue/test-utils';
 import Vuex from 'vuex';
 import {
-  GlButton,
   GlEmptyState,
   GlLoadingIcon,
   GlTable,
@@ -24,7 +23,9 @@ describe('ErrorTrackingList', () => {
 
   const findErrorListTable = () => wrapper.find('table');
   const findErrorListRows = () => wrapper.findAll('tbody tr');
-  const findButton = () => wrapper.find(GlButton);
+  const findSortDropdown = () => wrapper.find('.sort-dropdown');
+  const findRecentSearchesDropdown = () =>
+    wrapper.find('.filtered-search-history-dropdown-wrapper');
   const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
 
   function mountComponent({
@@ -33,6 +34,8 @@ describe('ErrorTrackingList', () => {
     stubs = {
       'gl-link': GlLink,
       'gl-table': GlTable,
+      'gl-dropdown': GlDropdown,
+      'gl-dropdown-item': GlDropdownItem,
     },
   } = {}) {
     wrapper = shallowMount(ErrorTrackingList, {
@@ -46,6 +49,9 @@ describe('ErrorTrackingList', () => {
         illustrationPath: 'illustration/path',
       },
       stubs,
+      data() {
+        return { errorSearchQuery: 'search' };
+      },
     });
   }
 
@@ -58,6 +64,9 @@ describe('ErrorTrackingList', () => {
       loadRecentSearches: jest.fn(),
       setIndexPath: jest.fn(),
       clearRecentSearches: jest.fn(),
+      setEndpoint: jest.fn(),
+      searchByQuery: jest.fn(),
+      sortByField: jest.fn(),
     };
 
     const state = createListState();
@@ -101,7 +110,7 @@ describe('ErrorTrackingList', () => {
     it('shows table', () => {
       expect(findLoadingIcon().exists()).toBe(false);
       expect(findErrorListTable().exists()).toBe(true);
-      expect(findButton().exists()).toBe(true);
+      expect(findSortDropdown().exists()).toBe(true);
     });
 
     it('shows list of errors in a table', () => {
@@ -121,16 +130,20 @@ describe('ErrorTrackingList', () => {
     describe('filtering', () => {
       const findSearchBox = () => wrapper.find(GlFormInput);
 
-      it('shows search box', () => {
+      it('shows search box & sort dropdown', () => {
         expect(findSearchBox().exists()).toBe(true);
+        expect(findSortDropdown().exists()).toBe(true);
       });
 
-      it('makes network request on submit', () => {
-        expect(actions.startPolling).toHaveBeenCalledTimes(1);
-
+      it('it searches by query', () => {
         findSearchBox().trigger('keyup.enter');
+        expect(actions.searchByQuery.mock.calls[0][1]).toEqual(wrapper.vm.errorSearchQuery);
+      });
 
-        expect(actions.startPolling).toHaveBeenCalledTimes(2);
+      it('it sorts by fields', () => {
+        const findSortItem = () => wrapper.find('.dropdown-item');
+        findSortItem().trigger('click');
+        expect(actions.sortByField).toHaveBeenCalled();
       });
     });
   });
@@ -148,7 +161,7 @@ describe('ErrorTrackingList', () => {
     it('shows empty table', () => {
       expect(findLoadingIcon().exists()).toBe(false);
       expect(findErrorListRows().length).toEqual(1);
-      expect(findButton().exists()).toBe(true);
+      expect(findSortDropdown().exists()).toBe(true);
     });
 
     it('shows a message prompting to refresh', () => {
@@ -170,7 +183,7 @@ describe('ErrorTrackingList', () => {
       expect(wrapper.find(GlEmptyState).exists()).toBe(true);
       expect(findLoadingIcon().exists()).toBe(false);
       expect(findErrorListTable().exists()).toBe(false);
-      expect(findButton().exists()).toBe(false);
+      expect(findSortDropdown().exists()).toBe(false);
     });
   });
 
@@ -201,13 +214,13 @@ describe('ErrorTrackingList', () => {
     it('shows empty message', () => {
       store.state.list.recentSearches = [];
 
-      expect(wrapper.find(GlDropdown).text()).toBe("You don't have any recent searches");
+      expect(findRecentSearchesDropdown().text()).toContain("You don't have any recent searches");
     });
 
     it('shows items', () => {
       store.state.list.recentSearches = ['great', 'search'];
 
-      const dropdownItems = wrapper.findAll(GlDropdownItem);
+      const dropdownItems = wrapper.findAll('.filtered-search-box li');
 
       expect(dropdownItems.length).toBe(3);
       expect(dropdownItems.at(0).text()).toBe('great');
diff --git a/spec/frontend/error_tracking/store/list/actions_spec.js b/spec/frontend/error_tracking/store/list/actions_spec.js
index 408b0205e93..fb659db9ab5 100644
--- a/spec/frontend/error_tracking/store/list/actions_spec.js
+++ b/spec/frontend/error_tracking/store/list/actions_spec.js
@@ -1,8 +1,13 @@
-import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
+import MockAdapter from 'axios-mock-adapter';
+import testAction from 'helpers/vuex_action_helper';
+import httpStatusCodes from '~/lib/utils/http_status';
+import createFlash from '~/flash';
 import * as actions from '~/error_tracking/store/list/actions';
 import * as types from '~/error_tracking/store/list/mutation_types';
 
+jest.mock('~/flash.js');
+
 describe('error tracking actions', () => {
   let mock;
 
@@ -15,15 +20,97 @@ describe('error tracking actions', () => {
   });
 
   describe('startPolling', () => {
-    it('commits SET_LOADING', () => {
-      mock.onGet().reply(200);
-      const endpoint = '/errors';
-      const commit = jest.fn();
-      const state = {};
+    it('should start polling for data', done => {
+      const payload = { errors: [{ id: 1 }, { id: 2 }] };
+
+      mock.onGet().reply(httpStatusCodes.OK, payload);
+      testAction(
+        actions.startPolling,
+        {},
+        {},
+        [
+          { type: types.SET_LOADING, payload: true },
+          { type: types.SET_ERRORS, payload: payload.errors },
+          { type: types.SET_LOADING, payload: false },
+        ],
+        [{ type: 'stopPolling' }],
+        () => {
+          done();
+        },
+      );
+    });
+
+    it('should show flash on API error', done => {
+      mock.onGet().reply(httpStatusCodes.BAD_REQUEST);
+
+      testAction(
+        actions.startPolling,
+        {},
+        {},
+        [{ type: types.SET_LOADING, payload: true }, { type: types.SET_LOADING, payload: false }],
+        [],
+        () => {
+          expect(createFlash).toHaveBeenCalledTimes(1);
+          done();
+        },
+      );
+    });
+  });
+
+  describe('restartPolling', () => {
+    it('should restart polling', () => {
+      testAction(
+        actions.restartPolling,
+        {},
+        {},
+        [{ type: types.SET_ERRORS, payload: [] }, { type: types.SET_LOADING, payload: true }],
+        [],
+      );
+    });
+  });
+
+  describe('searchByQuery', () => {
+    it('should search by query', () => {
+      const query = 'search';
+
+      testAction(
+        actions.searchByQuery,
+        query,
+        {},
+        [
+          { type: types.SET_SEARCH_QUERY, payload: query },
+          { type: types.ADD_RECENT_SEARCH, payload: query },
+        ],
+        [{ type: 'stopPolling' }, { type: 'startPolling' }],
+      );
+    });
+  });
+
+  describe('sortByField', () => {
+    it('should search by query', () => {
+      const field = 'frequency';
+
+      testAction(
+        actions.sortByField,
+        { field },
+        {},
+        [{ type: types.SET_SORT_FIELD, payload: { field } }],
+        [{ type: 'stopPolling' }, { type: 'startPolling' }],
+      );
+    });
+  });
 
-      actions.startPolling({ commit, state }, endpoint);
+  describe('setEnpoint', () => {
+    it('should set search endpoint', () => {
+      const endpoint = 'https://sentry.io';
 
-      expect(commit).toHaveBeenCalledWith(types.SET_LOADING, true);
+      testAction(
+        actions.setEndpoint,
+        { endpoint },
+        {},
+        [{ type: types.SET_ENDPOINT, payload: { endpoint } }],
+        [],
+      );
     });
   });
 });
diff --git a/spec/frontend/error_tracking/utils_spec.js b/spec/frontend/error_tracking/utils_spec.js
index 0e9047cd375..a0d6f7f009d 100644
--- a/spec/frontend/error_tracking/utils_spec.js
+++ b/spec/frontend/error_tracking/utils_spec.js
@@ -3,17 +3,6 @@ import * as errorTrackingUtils from '~/error_tracking/utils';
 const externalUrl = 'https://sentry.io/organizations/test-sentry-nk/issues/1/?project=1';
 
 describe('Error Tracking Events', () => {
-  describe('trackViewInSentryOptions', () => {
-    it('should return correct event options', () => {
-      expect(errorTrackingUtils.trackViewInSentryOptions(externalUrl)).toEqual({
-        category: 'Error Tracking',
-        action: 'click_view_in_sentry',
-        label: 'External Url',
-        property: externalUrl,
-      });
-    });
-  });
-
   describe('trackClickErrorLinkToSentryOptions', () => {
     it('should return correct event options', () => {
       expect(errorTrackingUtils.trackClickErrorLinkToSentryOptions(externalUrl)).toEqual({