From 01f12fb55d3ebb60d6f4d56b69fcae0d8f32fcc8 Mon Sep 17 00:00:00 2001
From: Tatyana <syrtsova.tanya@gmail.com>
Date: Thu, 10 Mar 2022 17:40:52 +0700
Subject: [PATCH 1/3] feat: add button tests

---
 src/components/UI/SwapButton.vue            |  7 ++-
 tests/unit/components/UI/SwapButton.spec.ts | 48 +++++++++++++++++++++
 2 files changed, 54 insertions(+), 1 deletion(-)
 create mode 100644 tests/unit/components/UI/SwapButton.spec.ts

diff --git a/src/components/UI/SwapButton.vue b/src/components/UI/SwapButton.vue
index b722e95..ce461f9 100644
--- a/src/components/UI/SwapButton.vue
+++ b/src/components/UI/SwapButton.vue
@@ -4,7 +4,12 @@
       <slot></slot>
     </span>
 
-    <span v-if="tooltip" v-tooltip="computedTooltipParams" class="swap-button__tooltip"></span>
+    <span
+      v-if="tooltip"
+      v-tooltip="computedTooltipParams"
+      data-testid="button-tooltip"
+      class="swap-button__tooltip"
+    ></span>
   </button>
 </template>
 
diff --git a/tests/unit/components/UI/SwapButton.spec.ts b/tests/unit/components/UI/SwapButton.spec.ts
new file mode 100644
index 0000000..eb0f296
--- /dev/null
+++ b/tests/unit/components/UI/SwapButton.spec.ts
@@ -0,0 +1,48 @@
+import SwapButton from '@/components/UI/SwapButton.vue'
+import { shallowMount } from '@vue/test-utils'
+
+const slotText = 'slot test'
+
+describe('Form password', () => {
+  let wrapper
+
+  const createComponent = ({ propsData = {}, provide = {} } = {}) => {
+    wrapper = shallowMount(SwapButton, {
+      propsData: {
+        ...propsData
+      },
+      provide: {
+        mediaQueries: { mobile: false },
+        ...provide
+      },
+      slots: {
+        default: slotText
+      }
+    })
+  }
+
+  it('renders slot', () => {
+    createComponent()
+
+    expect(wrapper.text()).toBe(slotText)
+  })
+
+  it('renders tooltip', () => {
+    createComponent({ propsData: { tooltip: 'Tooltip' } })
+
+    const buttonTooltip = wrapper.find('[data-testid="button-tooltip"]')
+
+    expect(buttonTooltip.exists()).toBe(true)
+  })
+
+  it.each`
+    propName
+    ${'round'}
+    ${'text'}
+    ${'disabled'}
+  `('has class for styles $propName', ({ propName }) => {
+    createComponent({ propsData: { [propName]: true } })
+
+    expect(wrapper.element.classList.value.includes(propName)).toBe(true)
+  })
+})

From abc0140a0dc3cb8c21852cbbcc60cb505294f30a Mon Sep 17 00:00:00 2001
From: Tatyana <syrtsova.tanya@gmail.com>
Date: Thu, 10 Mar 2022 17:54:05 +0700
Subject: [PATCH 2/3] fix: test name

---
 tests/unit/components/UI/SwapButton.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/unit/components/UI/SwapButton.spec.ts b/tests/unit/components/UI/SwapButton.spec.ts
index eb0f296..4239718 100644
--- a/tests/unit/components/UI/SwapButton.spec.ts
+++ b/tests/unit/components/UI/SwapButton.spec.ts
@@ -3,7 +3,7 @@ import { shallowMount } from '@vue/test-utils'
 
 const slotText = 'slot test'
 
-describe('Form password', () => {
+describe('Swap button', () => {
   let wrapper
 
   const createComponent = ({ propsData = {}, provide = {} } = {}) => {

From 37f5340664e66986e1a5ff81392e0a37c069c437 Mon Sep 17 00:00:00 2001
From: Tatyana <syrtsova.tanya@gmail.com>
Date: Mon, 4 Apr 2022 09:52:00 +0700
Subject: [PATCH 3/3] fix: add event handler tests

---
 tests/unit/components/UI/SwapButton.spec.ts | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/tests/unit/components/UI/SwapButton.spec.ts b/tests/unit/components/UI/SwapButton.spec.ts
index 4239718..9306969 100644
--- a/tests/unit/components/UI/SwapButton.spec.ts
+++ b/tests/unit/components/UI/SwapButton.spec.ts
@@ -6,7 +6,7 @@ const slotText = 'slot test'
 describe('Swap button', () => {
   let wrapper
 
-  const createComponent = ({ propsData = {}, provide = {} } = {}) => {
+  const createComponent = ({ propsData = {}, provide = {}, listeners = {} } = {}) => {
     wrapper = shallowMount(SwapButton, {
       propsData: {
         ...propsData
@@ -17,7 +17,8 @@ describe('Swap button', () => {
       },
       slots: {
         default: slotText
-      }
+      },
+      listeners
     })
   }
 
@@ -45,4 +46,18 @@ describe('Swap button', () => {
 
     expect(wrapper.element.classList.value.includes(propName)).toBe(true)
   })
+
+  it.each`
+    eventName
+    ${'click'}
+    ${'focus'}
+    ${'blur'}
+  `('emits $eventName event', async ({ eventName }) => {
+    const handler = jest.fn()
+    createComponent({ listeners: { [eventName]: handler } })
+
+    await wrapper.find('button').trigger(eventName)
+
+    expect(handler).toHaveBeenCalled()
+  })
 })