test: added tests

Author: kouts

tests/searchInput.spec.ts

@@ -1,6 +1,7 @@
 import { mount } from '@vue/test-utils'
 import SearchInput from '@/SearchInput.vue'
 import { fieldType } from '@/SearchInput.types'
+import { nextTick } from 'vue'
 
 const createWrapper = (opts?: Record<string, unknown>) => {
   return mount(SearchInput, opts)
@@ -26,7 +27,7 @@ describe('SearchInput.vue', () => {
   it('should render a search icon', async () => {
     const wrapper = createWrapper()
 
-    const div = await wrapper.find('div.search-icon search')
+    const div = await wrapper.find('div.search-icon.search')
 
     expect(div).toBeTruthy()
   })
@@ -51,4 +52,52 @@ describe('SearchInput.vue', () => {
 
     expect(onClick).toHaveBeenCalled()
   })
+
+  it('sets the value', async () => {
+    const wrapper = createWrapper()
+    const input = wrapper.find('input')
+
+    await input.setValue('test_value')
+
+    expect(input.element.value).toBe('test_value')
+  })
+
+  it('emits the updated value', async () => {
+    const wrapper = createWrapper()
+    const input = wrapper.find('input')
+
+    await input.setValue('test_value')
+
+    expect(wrapper.emitted()['update:modelValue'][0]).toEqual(['test_value'])
+  })
+
+  it('clears the value when the clear icon is clicked', async () => {
+    const wrapper = createWrapper({
+      props: {
+        modelValue: 'test'
+      }
+    })
+
+    const clearIcon = await wrapper.find('div.search-icon.clear')
+
+    await clearIcon.trigger('mousedown')
+
+    expect(wrapper.emitted()['update:modelValue'][0]).toEqual([''])
+  })
+
+  it('esc key clears the value', async () => {
+    const wrapper = createWrapper({
+      props: {
+        modelValue: 'test'
+      }
+    })
+
+    const input = wrapper.find('input')
+
+    await input.trigger('keydown', {
+      key: 'Escape'
+    })
+
+    expect(wrapper.emitted()['update:modelValue'][0]).toEqual([''])
+  })
 })