From 31dca96dae1f08e4f7abf1115df9b57b4f77f055 Mon Sep 17 00:00:00 2001
From: Matthias <xmatthias@outlook.com>
Date: Sat, 13 Apr 2024 13:02:25 +0200
Subject: [PATCH] Migrate profitPill test to vitest

---
 src/components/general/ProfitPill.cy.ts | 64 ------------------------
 tests/component/ProfitPill.spec.ts      | 66 +++++++++++++++++++++++++
 tests/tsconfig.json                     |  4 +-
 3 files changed, 68 insertions(+), 66 deletions(-)
 delete mode 100644 src/components/general/ProfitPill.cy.ts
 create mode 100644 tests/component/ProfitPill.spec.ts

diff --git a/src/components/general/ProfitPill.cy.ts b/src/components/general/ProfitPill.cy.ts
deleted file mode 100644
index 0b3ced79..00000000
--- a/src/components/general/ProfitPill.cy.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import ProfitPill from './ProfitPill.vue';
-
-describe('ProfitPill.vue', () => {
-  it('Shows a Green pill with positive profits', () => {
-    cy.mount(ProfitPill, {
-      props: {
-        profitRatio: 0.051,
-        profitAbs: 0.1,
-        profitDesc: '',
-        stakeCurrency: 'USDT',
-      },
-    });
-    cy.get('div').should('have.class', 'profit-pill-profit').should('be.visible');
-    cy.get('div').should('contain', '5.10%');
-    cy.get('div').should('contain', '(0.1)');
-    cy.get('span').should('have.attr', 'title', 'USDT');
-  });
-  it('Shows a Red pill with positive profits', () => {
-    cy.mount(ProfitPill, {
-      props: {
-        profitRatio: -0.1,
-        profitAbs: -0.1,
-        profitDesc: '',
-        stakeCurrency: 'USDT',
-      },
-    });
-
-    cy.get('div').should('not.have.class', 'profit-pill-profit').should('be.visible');
-    cy.get('div').should('have.class', 'profit-pill').should('be.visible');
-    cy.get('div').should('contain', '-10.00%');
-    cy.get('div').should('contain', '(-0.1)');
-    cy.get('span').should('have.attr', 'title', 'USDT');
-  });
-  it('Shows a pill with 0.0 profits.', () => {
-    cy.mount(ProfitPill, {
-      props: {
-        profitRatio: 0.0,
-        profitAbs: 0.0,
-        profitDesc: '',
-        stakeCurrency: 'BTC',
-      },
-    });
-
-    cy.get('div').should('have.class', 'profit-pill').should('be.visible');
-    cy.get('div').should('contain', '0.00%');
-    cy.get('div').should('contain', '(0)');
-    cy.get('span').should('have.attr', 'title', 'BTC');
-  });
-  it('Shows a pill without relative profits.', () => {
-    cy.mount(ProfitPill, {
-      props: {
-        profitRatio: undefined,
-        profitAbs: 223,
-        profitDesc: '',
-        stakeCurrency: 'USDT',
-      },
-    });
-
-    cy.get('div').should('have.class', 'profit-pill').should('be.visible');
-    // cy.get('div').should('not.contain', '%');
-    cy.get('div').should('contain', '223');
-    cy.get('span').should('have.attr', 'title', 'USDT');
-  });
-});
diff --git a/tests/component/ProfitPill.spec.ts b/tests/component/ProfitPill.spec.ts
new file mode 100644
index 00000000..4db3d2ad
--- /dev/null
+++ b/tests/component/ProfitPill.spec.ts
@@ -0,0 +1,66 @@
+import ProfitPill from '@/components/general/ProfitPill.vue';
+import { mount } from '@vue/test-utils';
+import { describe, expect, it } from 'vitest';
+
+describe('ProfitPill.vue', () => {
+  it('Shows a Green pill with positive profits', () => {
+    const wrapper = mount(ProfitPill, {
+      props: {
+        profitRatio: 0.051,
+        profitAbs: 0.1,
+        profitDesc: '',
+        stakeCurrency: 'USDT',
+      },
+    });
+    expect(wrapper.find('div').classes()).toContain('profit-pill-profit');
+    expect(wrapper.find('div').text()).toContain('5.10%');
+    expect(wrapper.find('div').text()).toContain('(0.1)');
+    expect(wrapper.find('span').element.title).toBe('USDT');
+  });
+  it('Shows a Red pill with positive profits', () => {
+    const wrapper = mount(ProfitPill, {
+      props: {
+        profitRatio: -0.1,
+        profitAbs: -0.1,
+        profitDesc: '',
+        stakeCurrency: 'USDT',
+      },
+    });
+
+    expect(wrapper.get('div').classes()).not.toContain('profit-pill-profit');
+    expect(wrapper.get('div').classes()).toContain('profit-pill');
+    expect(wrapper.get('div').text()).toContain('-10.00%');
+    expect(wrapper.get('div').text()).toContain('(-0.1)');
+    expect(wrapper.get('span').element.title).toBe('USDT');
+  });
+  it('Shows a pill with 0.0 profits.', () => {
+    const wrapper = mount(ProfitPill, {
+      props: {
+        profitRatio: 0.0,
+        profitAbs: 0.0,
+        profitDesc: '',
+        stakeCurrency: 'BTC',
+      },
+    });
+
+    expect(wrapper.get('div').classes()).toContain('profit-pill');
+    expect(wrapper.get('div').text()).toContain('0.00%');
+    expect(wrapper.get('div').text()).toContain('(0)');
+    expect(wrapper.get('span').element.title).toBe('BTC');
+  });
+  it('Shows a pill without relative profits.', () => {
+    const wrapper = mount(ProfitPill, {
+      props: {
+        profitRatio: undefined,
+        profitAbs: 223,
+        profitDesc: '',
+        stakeCurrency: 'USDT',
+      },
+    });
+
+    expect(wrapper.get('div').classes()).toContain('profit-pill');
+    expect(wrapper.get('div').text()).not.toContain('%');
+    expect(wrapper.get('div').text()).toContain('223');
+    expect(wrapper.get('span').element.title).toBe('USDT');
+  });
+});
diff --git a/tests/tsconfig.json b/tests/tsconfig.json
index 467156aa..42b36bfe 100644
--- a/tests/tsconfig.json
+++ b/tests/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "extends": "../tsconfig.json",
   "include": [
-    "unit/*.ts",
-    "unit/*.tsx"
+    "**/*.ts",
+    "**/*.tsx"
   ],
 }