1 files changed, 28 insertions, 37 deletions

diff --git a/spec/frontend/packages/list/components/packages_list_app_spec.js b/spec/frontend/packages/list/components/packages_list_app_spec.js
index 217096f822a..6862d23c4ff 100644
--- a/spec/frontend/packages/list/components/packages_list_app_spec.js
+++ b/spec/frontend/packages/list/components/packages_list_app_spec.js
@@ -1,11 +1,12 @@
-import Vuex from 'vuex';
+import { GlEmptyState, GlSprintf, GlLink } from '@gitlab/ui';
 import { shallowMount, createLocalVue } from '@vue/test-utils';
-import { GlEmptyState, GlTab, GlTabs, GlSprintf, GlLink } from '@gitlab/ui';
-import * as commonUtils from '~/lib/utils/common_utils';
+import Vuex from 'vuex';
 import createFlash from '~/flash';
+import * as commonUtils from '~/lib/utils/common_utils';
+import PackageSearch from '~/packages/list/components/package_search.vue';
 import PackageListApp from '~/packages/list/components/packages_list_app.vue';
-import { SHOW_DELETE_SUCCESS_ALERT } from '~/packages/shared/constants';
 import { DELETE_PACKAGE_SUCCESS_MESSAGE } from '~/packages/list/constants';
+import { SHOW_DELETE_SUCCESS_ALERT } from '~/packages/shared/constants';
 
 jest.mock('~/lib/utils/common_utils');
 jest.mock('~/flash');
@@ -26,9 +27,9 @@ describe('packages_list_app', () => {
   const emptyListHelpUrl = 'helpUrl';
   const findEmptyState = () => wrapper.find(GlEmptyState);
   const findListComponent = () => wrapper.find(PackageList);
-  const findTabComponent = (index = 0) => wrapper.findAll(GlTab).at(index);
+  const findPackageSearch = () => wrapper.find(PackageSearch);
 
-  const createStore = (filterQuery = '') => {
+  const createStore = (filter = []) => {
     store = new Vuex.Store({
       state: {
         isLoading: false,
@@ -38,7 +39,7 @@ describe('packages_list_app', () => {
           emptyListHelpUrl,
           packageHelpUrl: 'foo',
         },
-        filterQuery,
+        filter,
       },
     });
     store.dispatch = jest.fn();
@@ -52,8 +53,6 @@ describe('packages_list_app', () => {
         GlEmptyState,
         GlLoadingIcon,
         PackageList,
-        GlTab,
-        GlTabs,
         GlSprintf,
         GlLink,
       },
@@ -94,6 +93,7 @@ describe('packages_list_app', () => {
 
   it('call requestPackagesList on page:changed', () => {
     mountComponent();
+    store.dispatch.mockClear();
 
     const list = findListComponent();
     list.vm.$emit('page:changed', 1);
@@ -108,41 +108,15 @@ describe('packages_list_app', () => {
     expect(store.dispatch).toHaveBeenCalledWith('requestDeletePackage', 'foo');
   });
 
-  it('calls requestPackagesList on sort:changed', () => {
-    mountComponent();
-
-    const list = findListComponent();
-    list.vm.$emit('sort:changed');
-    expect(store.dispatch).toHaveBeenCalledWith('requestPackagesList');
-  });
-
   it('does not call requestPackagesList two times on render', () => {
     mountComponent();
 
     expect(store.dispatch).toHaveBeenCalledTimes(1);
   });
 
-  describe('tab change', () => {
-    it('calls requestPackagesList when all tab is clicked', () => {
-      mountComponent();
-
-      findTabComponent().trigger('click');
-
-      expect(store.dispatch).toHaveBeenCalledWith('requestPackagesList');
-    });
-
-    it('calls requestPackagesList when a package type tab is clicked', () => {
-      mountComponent();
-
-      findTabComponent(1).trigger('click');
-
-      expect(store.dispatch).toHaveBeenCalledWith('requestPackagesList');
-    });
-  });
-
   describe('filter without results', () => {
     beforeEach(() => {
-      createStore('foo');
+      createStore([{ type: 'something' }]);
       mountComponent();
     });
 
@@ -154,12 +128,29 @@ describe('packages_list_app', () => {
     });
   });
 
+  describe('Package Search', () => {
+    it('exists', () => {
+      mountComponent();
+
+      expect(findPackageSearch().exists()).toBe(true);
+    });
+
+    it('on update fetches data from the store', () => {
+      mountComponent();
+      store.dispatch.mockClear();
+
+      findPackageSearch().vm.$emit('update');
+
+      expect(store.dispatch).toHaveBeenCalledWith('requestPackagesList');
+    });
+  });
+
   describe('delete alert handling', () => {
     const { location } = window.location;
     const search = `?${SHOW_DELETE_SUCCESS_ALERT}=true`;
 
     beforeEach(() => {
-      createStore('foo');
+      createStore();
       jest.spyOn(commonUtils, 'historyReplaceState').mockImplementation(() => {});
       delete window.location;
       window.location = {