Add latest changes from gitlab-org/gitlab@master

1 files changed, 83 insertions, 0 deletions

diff --git a/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js b/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js
new file mode 100644
index 00000000000..e5f1ab21c7f
--- /dev/null
+++ b/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js
@@ -0,0 +1,83 @@
+import { shallowMount, createLocalVue } from '@vue/test-utils';
+import searchComponent from '~/frequent_items/components/frequent_items_search_input.vue';
+import eventHub from '~/frequent_items/event_hub';
+
+const localVue = createLocalVue();
+
+const createComponent = (namespace = 'projects') =>
+  shallowMount(localVue.extend(searchComponent), {
+    propsData: { namespace },
+    localVue,
+    sync: false,
+  });
+
+describe('FrequentItemsSearchInputComponent', () => {
+  let wrapper;
+  let vm;
+
+  beforeEach(() => {
+    wrapper = createComponent();
+
+    ({ vm } = wrapper);
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  describe('methods', () => {
+    describe('setFocus', () => {
+      it('should set focus to search input', () => {
+        jest.spyOn(vm.$refs.search, 'focus').mockImplementation(() => {});
+
+        vm.setFocus();
+
+        expect(vm.$refs.search.focus).toHaveBeenCalled();
+      });
+    });
+  });
+
+  describe('mounted', () => {
+    it('should listen `dropdownOpen` event', done => {
+      jest.spyOn(eventHub, '$on').mockImplementation(() => {});
+      const vmX = createComponent().vm;
+
+      localVue.nextTick(() => {
+        expect(eventHub.$on).toHaveBeenCalledWith(
+          `${vmX.namespace}-dropdownOpen`,
+          expect.any(Function),
+        );
+        done();
+      });
+    });
+  });
+
+  describe('beforeDestroy', () => {
+    it('should unbind event listeners on eventHub', done => {
+      const vmX = createComponent().vm;
+      jest.spyOn(eventHub, '$off').mockImplementation(() => {});
+
+      vmX.$mount();
+      vmX.$destroy();
+
+      localVue.nextTick(() => {
+        expect(eventHub.$off).toHaveBeenCalledWith(
+          `${vmX.namespace}-dropdownOpen`,
+          expect.any(Function),
+        );
+        done();
+      });
+    });
+  });
+
+  describe('template', () => {
+    it('should render component element', () => {
+      expect(wrapper.classes()).toContain('search-input-container');
+      expect(wrapper.contains('input.form-control')).toBe(true);
+      expect(wrapper.contains('.search-icon')).toBe(true);
+      expect(wrapper.find('input.form-control').attributes('placeholder')).toBe(
+        'Search your projects',
+      );
+    });
+  });
+});