Add unit test cases for search component

Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com>
Change-Id: I9721a9bc8b1fce850b824a2f9d7a6d199c5e0236

2 files changed, 94 insertions, 0 deletions

diff --git a/tests/unit/Global/Search.spec.js b/tests/unit/Global/Search.spec.js
new file mode 100644
index 00000000..eb553df6
--- /dev/null
+++ b/tests/unit/Global/Search.spec.js
@@ -0,0 +1,30 @@
+import { mount, createLocalVue } from '@vue/test-utils';
+import Search from '@/components/Global/Search';
+import BootstrapVue from 'bootstrap-vue';
+
+const localVue = createLocalVue();
+localVue.use(BootstrapVue);
+
+describe('Search.vue', () => {
+  const wrapper = mount(Search, {
+    localVue,
+    mocks: {
+      $t: (key) => key,
+    },
+  });
+  it('should exist', () => {
+    expect(wrapper.exists()).toBe(true);
+  });
+  it('should emit change-search on triggering onChangeInput', () => {
+    wrapper.find('input').trigger('input');
+    expect(wrapper.emitted('change-search')).toHaveLength(1);
+  });
+  it('should emit clear-search on triggering onClearSearch', async () => {
+    await wrapper.setData({ filter: 'true' });
+    wrapper.find('button').trigger('click');
+    expect(wrapper.emitted('clear-search')).toHaveLength(1);
+  });
+  it('should render correctly', () => {
+    expect(wrapper.element).toMatchSnapshot();
+  });
+});
diff --git a/tests/unit/Global/__snapshots__/Search.spec.js.snap b/tests/unit/Global/__snapshots__/Search.spec.js.snap
new file mode 100644
index 00000000..4f893845
--- /dev/null
+++ b/tests/unit/Global/__snapshots__/Search.spec.js.snap
@@ -0,0 +1,64 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Search.vue should render correctly 1`] = `
+<div
+  class="search-global"
+>
+  <div
+    class="form-group mb-2"
+    id="__BVID__4"
+    role="group"
+  >
+    <label
+      class="d-block invisible"
+      for="searchInput-3"
+      id="__BVID__4__BV_label_"
+    >
+      global.form.search
+    </label>
+    <div
+      class="bv-no-focus-ring"
+    >
+      <div
+        class="input-group align-items-center input-group-md"
+        role="group"
+      >
+        <!---->
+        <div
+          class="input-group-prepend"
+        >
+          <svg
+            aria-hidden="true"
+            class="search-icon"
+            fill="currentColor"
+            focusable="false"
+            height="16"
+            preserveAspectRatio="xMidYMid meet"
+            viewBox="0 0 16 16"
+            width="16"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M15,14.3L10.7,10c1.9-2.3,1.6-5.8-0.7-7.7S4.2,0.7,2.3,3S0.7,8.8,3,10.7c2,1.7,5,1.7,7,0l4.3,4.3L15,14.3z M2,6.5	C2,4,4,2,6.5,2S11,4,11,6.5S9,11,6.5,11S2,9,2,6.5z"
+            />
+          </svg>
+        </div>
+         
+        <input
+          aria-label="global.form.search"
+          class="search-input form-control"
+          id="searchInput-3"
+          placeholder="global.form.search"
+          type="text"
+        />
+         
+        <!---->
+        <!---->
+      </div>
+      <!---->
+      <!---->
+      <!---->
+    </div>
+  </div>
+</div>
+`;