diff --git a/bun.lockb b/bun.lockb index 5c4a279..4fa740f 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/jest.config.ts b/jest.config.ts deleted file mode 100644 index 5fe7711..0000000 --- a/jest.config.ts +++ /dev/null @@ -1,12 +0,0 @@ -export default { - preset: 'ts-jest', - testEnvironment: 'jest-environment-jsdom', - transform: { - "^.+\\.tsx?$": "ts-jest" - // process `*.tsx` files with `ts-jest` - }, - moduleNameMapper: { - '\\.(gif|ttf|eot|svg|png)$': '/test/__ mocks __/fileMock.js', - '^@/(.*)$': '/src/$1', - }, -} \ No newline at end of file diff --git a/package.json b/package.json index 2d0e5c0..bd2cf08 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "dev": "vite", "build": "tsc && vite build", "lint": "eslint . --fix --ext ts,tsx --report-unused-disable-directives --max-warnings 0 && prettier --write ./src", - "test": "jest", + "test": "vitest", "preview": "vite preview" }, "dependencies": { @@ -16,8 +16,8 @@ "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", "@radix-ui/react-toast": "^1.1.5", + "@testing-library/jest-dom": "^6.4.2", "@testing-library/react": "^14.2.1", - "@types/jest": "^29.5.12", "axios": "^1.6.7", "axios-rate-limit": "^1.3.0", "chart.js": "^4.4.1", @@ -25,16 +25,15 @@ "clsx": "^2.1.0", "date-fns": "^3.3.1", "identity-obj-proxy": "^3.0.0", - "jest": "^29.7.0", - "jest-environment-jsdom": "^29.7.0", + "jsdom": "^24.0.0", "prettier": "^3.2.5", "react": "^18.2.0", "react-chartjs-2": "^5.2.0", "react-day-picker": "^8.10.0", "react-dom": "^18.2.0", + "react-test-renderer": "^18.2.0", "tailwind-merge": "^2.2.1", "tailwindcss-animate": "^1.0.7", - "ts-jest": "^29.1.2", "ts-node": "^10.9.2" }, "devDependencies": { @@ -51,6 +50,7 @@ "postcss": "^8.4.33", "tailwindcss": "^3.4.1", "typescript": "^5.2.2", - "vite": "^5.0.8" + "vite": "^5.0.8", + "vitest": "^1.2.2" } } diff --git a/src/components/ui/use-toast.ts b/src/components/ui/use-toast.ts index d5a4817..e23789f 100644 --- a/src/components/ui/use-toast.ts +++ b/src/components/ui/use-toast.ts @@ -1,4 +1,3 @@ -// Inspired by react-hot-toast library import * as React from "react"; import type { ToastActionElement, ToastProps } from "@/components/ui/toast"; @@ -88,8 +87,6 @@ export const reducer = (state: State, action: Action): State => { case "DISMISS_TOAST": { const { toastId } = action; - // ! Side effects ! - This could be extracted into a dismissToast() action, - // but I'll keep it here for simplicity if (toastId) { addToRemoveQueue(toastId); } else { diff --git a/src/test/__mocks__/fileMock.js b/src/test/__mocks__/fileMock.js deleted file mode 100644 index e82a0b5..0000000 --- a/src/test/__mocks__/fileMock.js +++ /dev/null @@ -1,4 +0,0 @@ -module.exports = { - __esModule: true, - default: "test-file-stub", -}; diff --git a/src/test/__tests__/__snapshots__/chart.test.tsx.snap b/src/test/__tests__/__snapshots__/chart.test.tsx.snap new file mode 100644 index 0000000..e1b3c40 --- /dev/null +++ b/src/test/__tests__/__snapshots__/chart.test.tsx.snap @@ -0,0 +1,105 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`LinearChart Component Tests > renders chart with data 1`] = ` + +`; + +exports[`LinearChart Component Tests > renders without crashing 1`] = ` +{ + "asFragment": [Function], + "baseElement": +
+
+
+
+
+ , + "container":
+
+
+
+
, + "debug": [Function], + "findAllByAltText": [Function], + "findAllByDisplayValue": [Function], + "findAllByLabelText": [Function], + "findAllByPlaceholderText": [Function], + "findAllByRole": [Function], + "findAllByTestId": [Function], + "findAllByText": [Function], + "findAllByTitle": [Function], + "findByAltText": [Function], + "findByDisplayValue": [Function], + "findByLabelText": [Function], + "findByPlaceholderText": [Function], + "findByRole": [Function], + "findByTestId": [Function], + "findByText": [Function], + "findByTitle": [Function], + "getAllByAltText": [Function], + "getAllByDisplayValue": [Function], + "getAllByLabelText": [Function], + "getAllByPlaceholderText": [Function], + "getAllByRole": [Function], + "getAllByTestId": [Function], + "getAllByText": [Function], + "getAllByTitle": [Function], + "getByAltText": [Function], + "getByDisplayValue": [Function], + "getByLabelText": [Function], + "getByPlaceholderText": [Function], + "getByRole": [Function], + "getByTestId": [Function], + "getByText": [Function], + "getByTitle": [Function], + "queryAllByAltText": [Function], + "queryAllByDisplayValue": [Function], + "queryAllByLabelText": [Function], + "queryAllByPlaceholderText": [Function], + "queryAllByRole": [Function], + "queryAllByTestId": [Function], + "queryAllByText": [Function], + "queryAllByTitle": [Function], + "queryByAltText": [Function], + "queryByDisplayValue": [Function], + "queryByLabelText": [Function], + "queryByPlaceholderText": [Function], + "queryByRole": [Function], + "queryByTestId": [Function], + "queryByText": [Function], + "queryByTitle": [Function], + "rerender": [Function], + "unmount": [Function], +} +`; diff --git a/src/test/__tests__/__snapshots__/investmentSumarry.test.tsx.snap b/src/test/__tests__/__snapshots__/investmentSumarry.test.tsx.snap new file mode 100644 index 0000000..a0594ac --- /dev/null +++ b/src/test/__tests__/__snapshots__/investmentSumarry.test.tsx.snap @@ -0,0 +1,281 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`LinearChart Component Tests > renders chart with data 1`] = ` +{ + "asFragment": [Function], + "baseElement": +
+
+
+

+ Dinero Invertido +

+

+ 200.00 +

+
+
+ + + +

+ + + 50.00 +

+ +

+ 25.00 + % +

+
+
+

+ Valor del portafolio +

+

+ 250.00 +

+
+
+
+ , + "container":
+
+
+

+ Dinero Invertido +

+

+ 200.00 +

+
+
+ + + +

+ + + 50.00 +

+ +

+ 25.00 + % +

+
+
+

+ Valor del portafolio +

+

+ 250.00 +

+
+
+
, + "debug": [Function], + "findAllByAltText": [Function], + "findAllByDisplayValue": [Function], + "findAllByLabelText": [Function], + "findAllByPlaceholderText": [Function], + "findAllByRole": [Function], + "findAllByTestId": [Function], + "findAllByText": [Function], + "findAllByTitle": [Function], + "findByAltText": [Function], + "findByDisplayValue": [Function], + "findByLabelText": [Function], + "findByPlaceholderText": [Function], + "findByRole": [Function], + "findByTestId": [Function], + "findByText": [Function], + "findByTitle": [Function], + "getAllByAltText": [Function], + "getAllByDisplayValue": [Function], + "getAllByLabelText": [Function], + "getAllByPlaceholderText": [Function], + "getAllByRole": [Function], + "getAllByTestId": [Function], + "getAllByText": [Function], + "getAllByTitle": [Function], + "getByAltText": [Function], + "getByDisplayValue": [Function], + "getByLabelText": [Function], + "getByPlaceholderText": [Function], + "getByRole": [Function], + "getByTestId": [Function], + "getByText": [Function], + "getByTitle": [Function], + "queryAllByAltText": [Function], + "queryAllByDisplayValue": [Function], + "queryAllByLabelText": [Function], + "queryAllByPlaceholderText": [Function], + "queryAllByRole": [Function], + "queryAllByTestId": [Function], + "queryAllByText": [Function], + "queryAllByTitle": [Function], + "queryByAltText": [Function], + "queryByDisplayValue": [Function], + "queryByLabelText": [Function], + "queryByPlaceholderText": [Function], + "queryByRole": [Function], + "queryByTestId": [Function], + "queryByText": [Function], + "queryByTitle": [Function], + "rerender": [Function], + "unmount": [Function], +} +`; + +exports[`LinearChart Component Tests > renders without crashing 1`] = ` +{ + "asFragment": [Function], + "baseElement": +
+
+
+
+
+
+
+ , + "container":
+
+
+
+
+
+
, + "debug": [Function], + "findAllByAltText": [Function], + "findAllByDisplayValue": [Function], + "findAllByLabelText": [Function], + "findAllByPlaceholderText": [Function], + "findAllByRole": [Function], + "findAllByTestId": [Function], + "findAllByText": [Function], + "findAllByTitle": [Function], + "findByAltText": [Function], + "findByDisplayValue": [Function], + "findByLabelText": [Function], + "findByPlaceholderText": [Function], + "findByRole": [Function], + "findByTestId": [Function], + "findByText": [Function], + "findByTitle": [Function], + "getAllByAltText": [Function], + "getAllByDisplayValue": [Function], + "getAllByLabelText": [Function], + "getAllByPlaceholderText": [Function], + "getAllByRole": [Function], + "getAllByTestId": [Function], + "getAllByText": [Function], + "getAllByTitle": [Function], + "getByAltText": [Function], + "getByDisplayValue": [Function], + "getByLabelText": [Function], + "getByPlaceholderText": [Function], + "getByRole": [Function], + "getByTestId": [Function], + "getByText": [Function], + "getByTitle": [Function], + "queryAllByAltText": [Function], + "queryAllByDisplayValue": [Function], + "queryAllByLabelText": [Function], + "queryAllByPlaceholderText": [Function], + "queryAllByRole": [Function], + "queryAllByTestId": [Function], + "queryAllByText": [Function], + "queryAllByTitle": [Function], + "queryByAltText": [Function], + "queryByDisplayValue": [Function], + "queryByLabelText": [Function], + "queryByPlaceholderText": [Function], + "queryByRole": [Function], + "queryByTestId": [Function], + "queryByText": [Function], + "queryByTitle": [Function], + "rerender": [Function], + "unmount": [Function], +} +`; diff --git a/src/test/__tests__/__snapshots__/table.test.tsx.snap b/src/test/__tests__/__snapshots__/table.test.tsx.snap new file mode 100644 index 0000000..0e5ea25 --- /dev/null +++ b/src/test/__tests__/__snapshots__/table.test.tsx.snap @@ -0,0 +1,369 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`Table Component Tests > renders chart with data 1`] = ` +{ + "asFragment": [Function], + "baseElement": +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Resultados +
+ Fecha + + Monto invertido + + Valor del portafolio + + Ganancia + + Porcentaje de ganancia +
+ 2021-01 + + 100.00 + + 150.00 + + 0.00 + + 0.00 + % +
+ 2021-02 + + 200.00 + + 250.00 + + 50.00 + + 25.00 + % +
+
+
+
+ , + "container":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Resultados +
+ Fecha + + Monto invertido + + Valor del portafolio + + Ganancia + + Porcentaje de ganancia +
+ 2021-01 + + 100.00 + + 150.00 + + 0.00 + + 0.00 + % +
+ 2021-02 + + 200.00 + + 250.00 + + 50.00 + + 25.00 + % +
+
+
+
, + "debug": [Function], + "findAllByAltText": [Function], + "findAllByDisplayValue": [Function], + "findAllByLabelText": [Function], + "findAllByPlaceholderText": [Function], + "findAllByRole": [Function], + "findAllByTestId": [Function], + "findAllByText": [Function], + "findAllByTitle": [Function], + "findByAltText": [Function], + "findByDisplayValue": [Function], + "findByLabelText": [Function], + "findByPlaceholderText": [Function], + "findByRole": [Function], + "findByTestId": [Function], + "findByText": [Function], + "findByTitle": [Function], + "getAllByAltText": [Function], + "getAllByDisplayValue": [Function], + "getAllByLabelText": [Function], + "getAllByPlaceholderText": [Function], + "getAllByRole": [Function], + "getAllByTestId": [Function], + "getAllByText": [Function], + "getAllByTitle": [Function], + "getByAltText": [Function], + "getByDisplayValue": [Function], + "getByLabelText": [Function], + "getByPlaceholderText": [Function], + "getByRole": [Function], + "getByTestId": [Function], + "getByText": [Function], + "getByTitle": [Function], + "queryAllByAltText": [Function], + "queryAllByDisplayValue": [Function], + "queryAllByLabelText": [Function], + "queryAllByPlaceholderText": [Function], + "queryAllByRole": [Function], + "queryAllByTestId": [Function], + "queryAllByText": [Function], + "queryAllByTitle": [Function], + "queryByAltText": [Function], + "queryByDisplayValue": [Function], + "queryByLabelText": [Function], + "queryByPlaceholderText": [Function], + "queryByRole": [Function], + "queryByTestId": [Function], + "queryByText": [Function], + "queryByTitle": [Function], + "rerender": [Function], + "unmount": [Function], +} +`; + +exports[`Table Component Tests > renders without crashing 1`] = ` +{ + "asFragment": [Function], + "baseElement": +
+
+
+
+
+ , + "container":
+
+
+
+
, + "debug": [Function], + "findAllByAltText": [Function], + "findAllByDisplayValue": [Function], + "findAllByLabelText": [Function], + "findAllByPlaceholderText": [Function], + "findAllByRole": [Function], + "findAllByTestId": [Function], + "findAllByText": [Function], + "findAllByTitle": [Function], + "findByAltText": [Function], + "findByDisplayValue": [Function], + "findByLabelText": [Function], + "findByPlaceholderText": [Function], + "findByRole": [Function], + "findByTestId": [Function], + "findByText": [Function], + "findByTitle": [Function], + "getAllByAltText": [Function], + "getAllByDisplayValue": [Function], + "getAllByLabelText": [Function], + "getAllByPlaceholderText": [Function], + "getAllByRole": [Function], + "getAllByTestId": [Function], + "getAllByText": [Function], + "getAllByTitle": [Function], + "getByAltText": [Function], + "getByDisplayValue": [Function], + "getByLabelText": [Function], + "getByPlaceholderText": [Function], + "getByRole": [Function], + "getByTestId": [Function], + "getByText": [Function], + "getByTitle": [Function], + "queryAllByAltText": [Function], + "queryAllByDisplayValue": [Function], + "queryAllByLabelText": [Function], + "queryAllByPlaceholderText": [Function], + "queryAllByRole": [Function], + "queryAllByTestId": [Function], + "queryAllByText": [Function], + "queryAllByTitle": [Function], + "queryByAltText": [Function], + "queryByDisplayValue": [Function], + "queryByLabelText": [Function], + "queryByPlaceholderText": [Function], + "queryByRole": [Function], + "queryByTestId": [Function], + "queryByText": [Function], + "queryByTitle": [Function], + "rerender": [Function], + "unmount": [Function], +} +`; diff --git a/src/test/__tests__/calculateDCA.test.ts b/src/test/__tests__/calculateDCA.test.ts index 9416921..7e5e03b 100644 --- a/src/test/__tests__/calculateDCA.test.ts +++ b/src/test/__tests__/calculateDCA.test.ts @@ -1,5 +1,6 @@ import { calculateDCAInvestment } from "@/utils/dca"; import { HistoricalPrice, MonthlyDCAInvestment } from "@/types"; +import { describe, expect, it } from "vitest"; describe("calculateDCAInvestment", () => { const quantity = 20; @@ -129,7 +130,7 @@ describe("calculateDCAInvestment", () => { expect(investment).toStrictEqual(expectedDCA); }); - it("Caculate DCA complex", () => { + it("Caculate complex DCA", () => { const investment = calculateDCAInvestment(data2, quantity); expect(investment).toStrictEqual(expectedDCA2); }); diff --git a/src/test/__tests__/chart.test.tsx b/src/test/__tests__/chart.test.tsx new file mode 100644 index 0000000..6e681cb --- /dev/null +++ b/src/test/__tests__/chart.test.tsx @@ -0,0 +1,35 @@ +import LinearChart from "@/components/chart"; +import { MonthlyDCAInvestment } from "@/types"; +import { describe, expect, test } from "vitest"; +import { render } from "@testing-library/react"; + +const mockData: MonthlyDCAInvestment[] = [ + { + cryptoPortfolio: 0.1, + date: "2021-01", + fiatInvestment: 100, + gain: 0, + gainPercentage: 0, + portfolioFiatValue: 150, + price: 150, + }, + { + cryptoPortfolio: 0.2, + date: "2021-02", + fiatInvestment: 200, + gain: 50, + gainPercentage: 25, + portfolioFiatValue: 250, + price: 250, + }, +]; + +describe("LinearChart Component Tests", () => { + test("renders without crashing", () => { + expect(render()).toMatchSnapshot(); + }); + + test("renders chart with data", () => { + expect().toMatchSnapshot(); + }); +}); diff --git a/src/test/__tests__/investmentSumarry.test.tsx b/src/test/__tests__/investmentSumarry.test.tsx new file mode 100644 index 0000000..880daa7 --- /dev/null +++ b/src/test/__tests__/investmentSumarry.test.tsx @@ -0,0 +1,39 @@ +import InvestmentSummary from "@/components/investmentSummary"; +import { MonthlyDCAInvestment } from "@/types"; +import { describe, expect, test } from "vitest"; +import { render } from "@testing-library/react"; + +const mockData: MonthlyDCAInvestment[] = [ + { + cryptoPortfolio: 0.1, + date: "2021-01", + fiatInvestment: 100, + gain: 0, + gainPercentage: 0, + portfolioFiatValue: 150, + price: 150, + }, + { + cryptoPortfolio: 0.2, + date: "2021-02", + fiatInvestment: 200, + gain: 50, + gainPercentage: 25, + portfolioFiatValue: 250, + price: 250, + }, +]; + +describe("LinearChart Component Tests", () => { + test("renders without crashing", () => { + expect(render()).toMatchSnapshot(); + }); + + test("renders chart with data", () => { + const investmentSummary = render(); + expect(investmentSummary).toMatchSnapshot(); + expect(investmentSummary.getByText("25.00%")).toBeDefined(); + expect(investmentSummary.getByText("200.00")).toBeDefined(); + expect(investmentSummary.getByText("250.00")).toBeDefined(); + }); +}); diff --git a/src/test/__tests__/table.test.tsx b/src/test/__tests__/table.test.tsx new file mode 100644 index 0000000..1352629 --- /dev/null +++ b/src/test/__tests__/table.test.tsx @@ -0,0 +1,38 @@ +import Table from "@/components/dcaTable"; +import { test, expect, describe } from "vitest"; +import { MonthlyDCAInvestment } from "@/types"; +import { render } from "@testing-library/react"; + +const mockData: MonthlyDCAInvestment[] = [ + { + cryptoPortfolio: 0.1, + date: "2021-01", + fiatInvestment: 100, + gain: 0, + gainPercentage: 0, + portfolioFiatValue: 150, + price: 150, + }, + { + cryptoPortfolio: 0.2, + date: "2021-02", + fiatInvestment: 200, + gain: 50, + gainPercentage: 25, + portfolioFiatValue: 250, + price: 250, + }, +]; + +describe("Table Component Tests", () => { + test("renders without crashing", () => { + expect(render()).toMatchSnapshot(); + }); + + test("renders chart with data", () => { + const table = render(
); + expect(table).toMatchSnapshot(); + expect(table.getByText("2021-01")).toBeDefined(); + expect(table.getByText("25.00%")).toBeDefined(); + }); +}); diff --git a/src/test/setup.ts b/src/test/setup.ts new file mode 100644 index 0000000..971941d --- /dev/null +++ b/src/test/setup.ts @@ -0,0 +1,9 @@ +import { expect, afterEach } from "vitest"; +import { cleanup } from "@testing-library/react"; +import * as matchers from "@testing-library/jest-dom/matchers"; + +expect.extend(matchers); + +afterEach(() => { + cleanup(); +}); diff --git a/tsconfig.json b/tsconfig.json index bde600d..7c34376 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -11,8 +11,6 @@ "@/*": ["./src/*"] }, - "esModuleInterop": true, - /* Bundler mode */ "moduleResolution": "bundler", "allowImportingTsExtensions": true, @@ -27,8 +25,6 @@ "noUnusedParameters": true, "noFallthroughCasesInSwitch": true }, - "typeRoots": ["../node_modules/@types", "./node_modules/@types", "../node_modules/@testing-library"], - "types": ["jest", "jest-dom"], "include": ["src"], "references": [{ "path": "./tsconfig.node.json" }] } diff --git a/vite.config.ts b/vite.config.ts index a1653f5..13963b8 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,3 +1,4 @@ +/// import path from "path"; import react from "@vitejs/plugin-react-swc"; import { defineConfig } from "vite"; @@ -9,6 +10,12 @@ export default defineConfig({ "@": path.resolve(__dirname, "./src"), }, }, + test: { + globals: true, + environment: "jsdom", + setupFiles: './src/test/setup.ts', + }, + preview: { port: 8080, strictPort: true, @@ -16,7 +23,7 @@ export default defineConfig({ "/api": { target: "https://www.buda.com", changeOrigin: true, - rewrite: (path) => path.replace(/^\/api/, "/api/v2"), + rewrite: path => path.replace(/^\/api/, "/api/v2"), }, }, }, @@ -25,7 +32,7 @@ export default defineConfig({ "/api": { target: "https://www.buda.com", changeOrigin: true, - rewrite: (path) => path.replace(/^\/api/, "/api/v2"), + rewrite: path => path.replace(/^\/api/, "/api/v2"), }, }, port: 8080,