diff --git a/src/components/ListingComponent/__tests__/ListingComponent.spec.ts b/src/components/ListingComponent/__tests__/ListingComponent.spec.ts index c084ae9..df6cfec 100644 --- a/src/components/ListingComponent/__tests__/ListingComponent.spec.ts +++ b/src/components/ListingComponent/__tests__/ListingComponent.spec.ts @@ -1,63 +1,19 @@ import { mount } from "@vue/test-utils"; -import ListingComponent from "../ListingComponent.vue"; - -const depositsMocked = [ - { - depositId: 1, - event: "DepositAdded", - args: { - amount: 100, - }, - }, - { - depositId: 2, - event: "DepositAdded", - args: { - amount: 200, - }, - }, - { - depositId: 3, - event: "DepositAdded", - args: { - amount: 300, - }, - }, - { - depositId: 4, - event: "DepositAdded", - args: { - amount: 400, - }, - }, - { - depositId: 5, - event: "DepositAdded", - args: { - amount: 500, - }, - }, - { - depositId: 6, - event: "DepositAdded", - args: { - amount: 600, - }, - }, - { - depositId: 7, - event: "DepositAdded", - args: { - amount: 700, - }, - }, -]; +import ListingComponent from "@/components/ListingComponent/ListingComponent.vue"; +import { createPinia, setActivePinia } from "pinia"; +import { expect } from 'vitest' +import { MockValidDeposits } from "@/model/mock/ValidDepositMock"; +import { MockEvents } from "@/model/mock/EventMock"; describe("ListingComponent.vue", () => { + beforeEach(() => { + setActivePinia(createPinia()); + }); + test("Test Headers on List in Manage Mode", () => { const wrapper = mount(ListingComponent, { props: { - walletTransactions: depositsMocked, + walletTransactions: MockValidDeposits, isManageMode: true, }, }); @@ -71,7 +27,7 @@ describe("ListingComponent.vue", () => { test("Test Headers on List in Unmanage Mode", () => { const wrapper = mount(ListingComponent, { props: { - walletTransactions: depositsMocked, + walletTransactions: MockEvents, isManageMode: false, }, }); @@ -85,12 +41,12 @@ describe("ListingComponent.vue", () => { test("Test number of elements in the list first render", () => { const wrapper = mount(ListingComponent, { props: { - walletTransactions: depositsMocked, + walletTransactions: MockEvents, isManageMode: false, }, }); - const elements = wrapper.findAll(".transfer-type"); + const elements = wrapper.findAll(".transaction-date"); expect(elements).toHaveLength(3); }); @@ -98,38 +54,47 @@ describe("ListingComponent.vue", () => { test("Test load more button behavior", async () => { const wrapper = mount(ListingComponent, { props: { - walletTransactions: depositsMocked, + walletTransactions: MockValidDeposits, isManageMode: false, }, }); - const btn = wrapper.find("button"); - await btn.trigger("click"); - let elements = wrapper.findAll(".transfer-type"); - - expect(elements).toHaveLength(6); + let elements = wrapper.findAll(".transaction-date"); + expect(elements).toHaveLength(3); await btn.trigger("click"); - elements = wrapper.findAll(".transfer-type"); + elements = wrapper.findAll(".transaction-date"); - expect(elements).toHaveLength(7); + expect(elements).toHaveLength(5); }); - test("Test cancel offer button", async () => { + test("Test cancel offer button emit", async () => { const wrapper = mount(ListingComponent, { props: { - walletTransactions: depositsMocked, + walletTransactions: MockValidDeposits, isManageMode: true, }, }); + wrapper.vm.$emit("cancelDeposit"); - const cancelButton = wrapper.find('img[alt="Cancel image"]'); - await cancelButton.trigger("click"); + await wrapper.vm.$nextTick(); - const elements = wrapper.findAll(".transaction-date"); + expect(wrapper.emitted("cancelDeposit")).toBeTruthy(); + }); - expect(elements).toHaveLength(2); + test("Test withdraw offer button emit", async () => { + const wrapper = mount(ListingComponent, { + props: { + walletTransactions: MockValidDeposits, + isManageMode: true, + }, + }); + wrapper.vm.$emit("withdrawDeposit"); + + await wrapper.vm.$nextTick(); + + expect(wrapper.emitted("withdrawDeposit")).toBeTruthy(); }); }); diff --git a/src/model/mock/EventMock.ts b/src/model/mock/EventMock.ts new file mode 100644 index 0000000..c3c606c --- /dev/null +++ b/src/model/mock/EventMock.ts @@ -0,0 +1,101 @@ +import type { Event } from "ethers"; +import { vi } from "vitest"; + +export const MockEvents: Event[] = [ + { + "blockNumber": 1, + "blockHash": "0x8", + "transactionIndex": 1, + "removed": false, + "address": "0x0", + "data": "0x0", + "topics": [ + "0x0", + "0x0" + ], + "transactionHash": "0x0", + "logIndex": 1, + "event": "DepositAdded", + "eventSignature": "DepositAdded(address,uint256,address,uint256)", + "args": [ + "0x0", + { + "type": "BigNumber", + "hex": "0x00" + }, + "0x0", + { + "type": "BigNumber", + "hex": "0x6c6b935b8bbd400000" + }, + ], + getBlock: vi.fn(), + removeListener: vi.fn(), + getTransaction: vi.fn(), + getTransactionReceipt: vi.fn(), + }, + { + "blockNumber": 2, + "blockHash": "0x8", + "transactionIndex": 2, + "removed": false, + "address": "0x0", + "data": "0x0", + "topics": [ + "0x0", + "0x0" + ], + "transactionHash": "0x0", + "logIndex": 2, + "event": "LockAdded", + "eventSignature": "LockAdded(address,uint256,address,uint256)", + "args": [ + "0x0", + { + "type": "BigNumber", + "hex": "0x00" + }, + "0x0", + { + "type": "BigNumber", + "hex": "0x6c6b935b8bbd400000" + }, + ], + getBlock: vi.fn(), + removeListener: vi.fn(), + getTransaction: vi.fn(), + getTransactionReceipt: vi.fn(), + }, + { + "blockNumber": 3, + "blockHash": "0x8", + "transactionIndex": 3, + "removed": false, + "address": "0x0", + "data": "0x0", + "topics": [ + "0x0", + "0x0" + ], + "transactionHash": "0x0", + "logIndex": 3, + "event": "LockReleased", + "eventSignature": "LockReleased(address,uint256,address,uint256)", + "args": [ + "0x0", + { + "type": "BigNumber", + "hex": "0x00" + }, + "0x0", + { + "type": "BigNumber", + "hex": "0x6c6b935b8bbd400000" + }, + ], + getBlock: vi.fn(), + removeListener: vi.fn(), + getTransaction: vi.fn(), + getTransactionReceipt: vi.fn(), + } + ]; \ No newline at end of file diff --git a/src/model/mock/ValidDepositMock.ts b/src/model/mock/ValidDepositMock.ts new file mode 100644 index 0000000..83a6412 --- /dev/null +++ b/src/model/mock/ValidDepositMock.ts @@ -0,0 +1,40 @@ +import { parseEther } from "ethers/lib/utils"; +import type { ValidDeposit } from "../ValidDeposit"; + +export const MockValidDeposits: ValidDeposit[] = [ + { + "blockNumber": 1, + "depositID": parseEther("1"), + "remaining": 70, + "seller": "mockedSellerAddress", + "pixKey": "123456789" + }, + { + "blockNumber": 2, + "depositID": parseEther("2"), + "remaining": 200, + "seller": "mockedSellerAddress", + "pixKey": "123456789" + }, + { + "blockNumber": 3, + "depositID": parseEther("3"), + "remaining": 1250, + "seller": "mockedSellerAddress", + "pixKey": "123456789" + }, + { + "blockNumber": 4, + "depositID": parseEther("4"), + "remaining": 4000, + "seller": "mockedSellerAddress", + "pixKey": "123456789" + }, + { + "blockNumber": 5, + "depositID": parseEther("5"), + "remaining": 2000, + "seller": "mockedSellerAddress", + "pixKey": "123456789" + } + ] \ No newline at end of file