From 34f92406bdfaad7b7f6b69c8154a3e9f253948e4 Mon Sep 17 00:00:00 2001 From: Atris Date: Thu, 25 Jan 2024 15:10:53 +0100 Subject: [PATCH] tests: unignore and fix tests --- .../common/__tests__/ErrorModal.test.tsx | 2 +- .../discovery/__tests__/LandingPage.test.tsx | 52 +-- .../features/round/ViewCartPage.ignored.tsx | 380 ------------------ .../__tests__/ViewProjectDetails.test.tsx | 52 +-- .../round/__tests__/ViewRoundPage.test.tsx | 2 +- packages/grant-explorer/src/index.tsx | 6 +- 6 files changed, 27 insertions(+), 467 deletions(-) delete mode 100644 packages/grant-explorer/src/features/round/ViewCartPage.ignored.tsx diff --git a/packages/grant-explorer/src/features/common/__tests__/ErrorModal.test.tsx b/packages/grant-explorer/src/features/common/__tests__/ErrorModal.test.tsx index 44b06ed3b0..91afa1101e 100644 --- a/packages/grant-explorer/src/features/common/__tests__/ErrorModal.test.tsx +++ b/packages/grant-explorer/src/features/common/__tests__/ErrorModal.test.tsx @@ -78,7 +78,7 @@ describe("", () => { expect(setIsOpenFn).toBeCalledWith(false); }); - it.skip("should close the modal if close on background click is enabled and background is clicked", () => { + it("should close the modal if close on background click is enabled and background is clicked", () => { const doneFn = vi.fn(); const setIsOpenFn = vi.fn(); diff --git a/packages/grant-explorer/src/features/discovery/__tests__/LandingPage.test.tsx b/packages/grant-explorer/src/features/discovery/__tests__/LandingPage.test.tsx index 09c270ceaf..ec18a0b380 100644 --- a/packages/grant-explorer/src/features/discovery/__tests__/LandingPage.test.tsx +++ b/packages/grant-explorer/src/features/discovery/__tests__/LandingPage.test.tsx @@ -1,5 +1,5 @@ import { faker } from "@faker-js/faker"; -import { fireEvent, screen, waitFor } from "@testing-library/react"; +import { screen, waitFor } from "@testing-library/react"; import { makeRoundOverviewData, mockBalance, @@ -7,8 +7,6 @@ import { mockSigner, renderWithContext, } from "../../../test-utils"; -import { __deprecated_RoundMetadata } from "../../api/round"; -import { __deprecated_RoundOverview } from "../../api/rounds"; import LandingPage from "../LandingPage"; import { vi } from "vitest"; import { DataLayer } from "data-layer"; @@ -115,52 +113,4 @@ describe("LandingPage", () => { }); }); }); - - it.skip("filters active rounds based on search query", async () => { - const roundMetadata: __deprecated_RoundMetadata = { - name: "gitcoin", - roundType: "private", - eligibility: { - description: faker.lorem.sentence(), - requirements: [], - }, - programContractAddress: faker.finance.ethereumAddress(), - }; - - const activeRounds: __deprecated_RoundOverview[] = [ - makeRoundOverviewData(), - makeRoundOverviewData(), - makeRoundOverviewData({ roundMetadata }), - makeRoundOverviewData({ - roundMetadata: { - ...roundMetadata, - name: "gitcoin pro", - }, - }), - ]; - - renderWithContext(); - - await waitFor(async () => { - // Make sure all active rounds are displayed initially - activeRounds.forEach((round) => { - expect( - screen.getByText(round.roundMetadata?.name ?? "") - ).toBeInTheDocument(); - }); - }); - - const searchInput = screen.getByPlaceholderText("Search..."); - const roundCards = screen.getAllByTestId("round-card"); - expect(roundCards.length).toEqual(activeRounds.length); - - const searchQuery = "gitcoin"; - fireEvent.change(searchInput, { target: { value: searchQuery } }); - - await waitFor(() => { - const filteredRoundCards = screen.getAllByTestId("round-name"); - expect(filteredRoundCards.length).toEqual(2); - expect(filteredRoundCards[0].textContent).toEqual(searchQuery); - }); - }); }); diff --git a/packages/grant-explorer/src/features/round/ViewCartPage.ignored.tsx b/packages/grant-explorer/src/features/round/ViewCartPage.ignored.tsx deleted file mode 100644 index cd33a8f916..0000000000 --- a/packages/grant-explorer/src/features/round/ViewCartPage.ignored.tsx +++ /dev/null @@ -1,380 +0,0 @@ -import ViewCart from "./ViewCartPage/ViewCartPage"; -import { fireEvent, render, screen } from "@testing-library/react"; -import { CartProject } from "../api/types"; -import { - makeApprovedProjectData, - mockBalance, - mockNetwork, - mockSigner, -} from "../../test-utils"; -import { RoundProvider } from "../../context/RoundContext"; -import { faker } from "@faker-js/faker"; -import { MemoryRouter } from "react-router-dom"; -import { getVotingTokenOptions } from "../api/utils"; - -process.env.REACT_APP_PASSPORT_API_COMMUNITY_ID = "12"; -const chainId = 5; -const roundId = faker.finance.ethereumAddress(); -const userAddress = faker.finance.ethereumAddress(); - -const mockAccount = { - address: userAddress, - isConnected: true, -}; - -const useParamsFn = () => ({ - chainId, - roundId, -}); - -jest.mock("../../common/Navbar"); -jest.mock("../../common/Auth"); -jest.mock("wagmi", () => ({ - useAccount: () => mockAccount, - useBalance: () => mockBalance, - useSigner: () => mockSigner, - useNetwork: () => mockNetwork, -})); -jest.mock("@rainbow-me/rainbowkit", () => ({ - ConnectButton: jest.fn(), - ...jest.requireActual("@rainbow-me/rainbowkit"), -})); -jest.mock("react-router-dom", () => ({ - ...jest.requireActual("react-router-dom"), - useParams: useParamsFn, -})); -jest.mock("../../api/passport", () => ({ - ...jest.requireActual("../../api/passport"), - fetchPassport: () => Promise.resolve({ score: 10000000 }), -})); - -describe.skip("View Cart Page", () => { - describe("Projects", () => { - beforeEach(() => { - jest.clearAllMocks(); - }); - - it("shows list of projects with project name", () => { - const cart: CartProject[] = [ - makeApprovedProjectData(), - makeApprovedProjectData(), - ]; - - renderWrapped(); - - const projects = screen.getAllByTestId("cart-project"); - expect(projects.length).toEqual(cart.length); - projects.forEach((project, i) => { - expect(project.textContent).toContain(cart[i].projectMetadata.title); - }); - }); - - it("shows message that you have no projects", () => { - renderWrapped(); - - screen.getByText(/Cart is empty./i); - }); - - it("moves project from final donation to cart when clicking the send back button", async () => { - const setCart = jest.fn(); - - renderWrapped(); - - // expect(screen.getAllByTestId("project").length).toEqual(0); - expect(screen.getAllByTestId("cart-project").length).toEqual(2); - - /* Click the first project */ - const removeProjectFromCart = - screen.getAllByTestId("remove-from-cart")[0]; - fireEvent.click(removeProjectFromCart); - - expect(setCart).toHaveBeenCalled(); - }); - - it("displays the bread crumbs", async () => { - renderWrapped(); - - expect(await screen.findByTestId("bread-crumbs")).toBeInTheDocument(); - }); - }); - - describe("Summary", () => { - beforeEach(() => { - jest.clearAllMocks(); - }); - - it("shows default amount when you have no projects in cart", () => { - renderWrapped(); - - const totalDonation = screen.getByTestId("totalDonation"); - expect(totalDonation).toHaveTextContent("0"); - }); - - it("reflects a change in donation to one project in the final contribution", () => { - const cart: CartProject[] = [makeApprovedProjectData()]; - - renderWrapped(); - - /* Set donation amount on one project */ - const projectDonationInput = screen.getByRole("spinbutton", { - name: `Donation amount for project ${cart[0].projectMetadata.title}`, - }); - - fireEvent.change(projectDonationInput, { - target: { - value: "10", - }, - }); - - const totalDonation = screen.getByTestId("totalDonation"); - expect(totalDonation).toHaveTextContent("10"); - }); - - it("reflects a change in donation to two projects in the final contribution", () => { - const cart: CartProject[] = [ - makeApprovedProjectData(), - makeApprovedProjectData(), - ]; - - renderWrapped(); - - /* Set donation amount on one project */ - const projectDonationInput = screen.getByRole("spinbutton", { - name: `Donation amount for project ${cart[0].projectMetadata.title}`, - }); - fireEvent.change(projectDonationInput, { - target: { - value: "10", - }, - }); - - const secondProjectDonationInput = screen.getByRole("spinbutton", { - name: `Donation amount for project ${cart[1].projectMetadata.title}`, - }); - fireEvent.change(secondProjectDonationInput, { - target: { - value: "20", - }, - }); - - const totalDonation = screen.getByTestId("totalDonation"); - expect(totalDonation).toHaveTextContent("30"); - - /* Lower donation */ - fireEvent.change( - screen.getByRole("spinbutton", { - name: `Donation amount for project ${cart[1].projectMetadata.title}`, - }), - { - target: { - value: "10", - }, - } - ); - - expect(screen.getByTestId("totalDonation")).toHaveTextContent("20"); - }); - - it("updates token summary based on selected token", async () => { - const chainId = 1; - - const useParamsFn = () => ({ - chainId, - roundId, - }); - - jest.mock("react-router-dom", () => ({ - ...jest.requireActual("react-router-dom"), - useParams: useParamsFn, - })); - - renderWrapped(); - - const options = getVotingTokenOptions(chainId); - expect(screen.getByTestId("summaryPayoutToken")).toHaveTextContent( - options[0].name - ); - }); - }); - - describe("Submit Your Donation", () => { - beforeEach(() => { - jest.clearAllMocks(); - }); - - it("shows error when clicking on submit with a donation field empty", async () => { - renderWrapped(); - - /* Click on Confirm Button */ - const confirmButton = screen.getByTestId("handle-confirmation"); - fireEvent.click(confirmButton); - - expect( - await screen.queryByTestId("confirm-modal") - ).not.toBeInTheDocument(); - expect( - await screen.queryByTestId("insufficientBalance") - ).not.toBeInTheDocument(); - expect(await screen.queryByTestId("emptyInput")).toBeInTheDocument(); - }); - - it("shows error when clicking on submit with user having lesser balance then total donation", async () => { - const cart: CartProject[] = [makeApprovedProjectData()]; - - renderWrapped(); - - /* Set donation amount on one project */ - const projectDonationInput = screen.getByRole("spinbutton", { - name: `Donation amount for project ${cart[0].projectMetadata.title}`, - }); - fireEvent.change(projectDonationInput, { - target: { - value: "100", - }, - }); - - /* Click on Confirm Button */ - const confirmButton = screen.getByTestId("handle-confirmation"); - fireEvent.click(confirmButton); - - expect( - await screen.queryByTestId("insufficientBalance") - ).toBeInTheDocument(); - expect(await screen.queryByTestId("emptyInput")).not.toBeInTheDocument(); - expect( - await screen.queryByTestId("confirm-modal") - ).not.toBeInTheDocument(); - }); - - it("opens confirmation modal when user clicks on submit with sufficient balance and donation fields set", async () => { - const cart: CartProject[] = [makeApprovedProjectData()]; - - renderWrapped(); - - /* Set donation amount on one project */ - const projectDonationInput = screen.getByRole("spinbutton", { - name: `Donation amount for project ${cart[0].projectMetadata.title}`, - }); - fireEvent.change(projectDonationInput, { - target: { - value: "1", - }, - }); - - /* Click on Confirm Button */ - const confirmButton = screen.getByTestId("handle-confirmation"); - fireEvent.click(confirmButton); - - expect( - await screen.queryByTestId("insufficientBalance") - ).not.toBeInTheDocument(); - expect(await screen.queryByTestId("emptyInput")).not.toBeInTheDocument(); - expect(await screen.queryByTestId("confirm-modal")).toBeInTheDocument(); - }); - }); - - it("apply to all and amount fields are visible", async () => { - const useParamsFn = () => ({ - chainId, - roundId, - }); - - jest.mock("react-router-dom", () => ({ - ...jest.requireActual("react-router-dom"), - useParams: useParamsFn, - })); - - renderWrapped(); - - const amountInputField = screen.getByRole("spinbutton", { - name: /donation amount for all projects/i, - }); - expect(amountInputField).toBeInTheDocument(); - - const applyAllButton = screen.getByRole("button", { - name: /apply to all/i, - }); - expect(applyAllButton).toBeInTheDocument(); - }); - - it("applies the donation to all projects", function () { - const cart: CartProject[] = [ - makeApprovedProjectData(), - makeApprovedProjectData(), - ]; - - renderWrapped(); - - const amountInputField = screen.getByRole("spinbutton", { - name: /donation amount for all projects/i, - }); - - const applyAllButton = screen.getByRole("button", { - name: /apply to all/i, - }); - - fireEvent.change(amountInputField, { - target: { - value: 100, - }, - }); - fireEvent.click(applyAllButton); - - const projectDonationInput1 = screen.getByRole( - "spinbutton", - { - name: `Donation amount for project ${cart[0].projectMetadata.title}`, - } - ); - const projectDonationInput2 = screen.getByRole( - "spinbutton", - { - name: `Donation amount for project ${cart[1].projectMetadata.title}`, - } - ); - - expect(projectDonationInput1.value).toBe("100"); - expect(projectDonationInput2.value).toBe("100"); - }); - - it("shows payout token drop down", () => { - renderWrapped(); - - const PayoutTokenDropdown = screen.getByTestId("payout-token-select"); - expect(PayoutTokenDropdown).toBeInTheDocument(); - }); - - it("renders a dropdown list of tokens when payout token input is clicked", async () => { - const chainId = 1; - - const useParamsFn = () => ({ - chainId, - roundId, - }); - - jest.mock("react-router-dom", () => ({ - ...jest.requireActual("react-router-dom"), - useParams: useParamsFn, - })); - - renderWrapped(); - - const options = getVotingTokenOptions(chainId); - - const payoutTokenSelection = screen.getByTestId("payout-token-select"); - fireEvent.click(payoutTokenSelection); - - const selectOptions = await screen.findAllByTestId("payout-token-option"); - expect(selectOptions).toHaveLength(options.length); - }); -}); - -function renderWrapped() { - render( - - - - - - ); -} diff --git a/packages/grant-explorer/src/features/round/__tests__/ViewProjectDetails.test.tsx b/packages/grant-explorer/src/features/round/__tests__/ViewProjectDetails.test.tsx index 8c66891287..9deee1db5f 100644 --- a/packages/grant-explorer/src/features/round/__tests__/ViewProjectDetails.test.tsx +++ b/packages/grant-explorer/src/features/round/__tests__/ViewProjectDetails.test.tsx @@ -1,7 +1,6 @@ import { faker } from "@faker-js/faker"; import { fireEvent, screen, waitFor } from "@testing-library/react"; import { act } from "react-dom/test-utils"; -import { SWRConfig } from "swr"; import { makeApprovedProjectData, makeRoundData, @@ -362,7 +361,7 @@ describe("voting cart", () => { }, 3000); }); - it.skip("shows a add-to-cart button replacing a remove-from-cart button when remove-from-balled is clicked", async () => { + it("shows a add-to-cart button replacing a remove-from-cart button when remove-from-cart is clicked", async () => { renderWithContext(, { roundState: { rounds: [roundWithProjects], @@ -370,40 +369,31 @@ describe("voting cart", () => { }, }); - // mock screen size - setWindowDimensions(1200, 800); - - expect(renderComponentsBasedOnDeviceSize()).toBe("desktop"); - // click add to cart const addToCart = screen.getAllByTestId("add-to-cart"); - fireEvent.click(addToCart[1]); + fireEvent.click(addToCart[0]); - await act(async () => { - await waitFor( - () => { - expect( - screen.queryAllByTestId("remove-from-cart")[1] - ).toBeInTheDocument(); - expect(screen.queryByTestId("add-to-cart")).not.toBeInTheDocument(); - }, - { timeout: 3000 } - ); - }); + await waitFor( + () => { + expect( + screen.queryAllByTestId("remove-from-cart")[0] + ).toBeInTheDocument(); + expect(screen.queryByTestId("add-to-cart")).not.toBeInTheDocument(); + }, + { timeout: 3000 } + ); const removeFromCart = screen.getAllByTestId("remove-from-cart"); - fireEvent.click(removeFromCart[1]); + fireEvent.click(removeFromCart[0]); - await act(async () => { - await waitFor( - () => { - expect(screen.queryAllByTestId("add-to-cart")[1]).toBeInTheDocument(); - expect( - screen.queryByTestId("remove-from-cart") - ).not.toBeInTheDocument(); - }, - { timeout: 3000 } - ); - }); + await waitFor( + () => { + expect(screen.queryAllByTestId("add-to-cart")[0]).toBeInTheDocument(); + expect( + screen.queryByTestId("remove-from-cart") + ).not.toBeInTheDocument(); + }, + { timeout: 3000 } + ); }); }); diff --git a/packages/grant-explorer/src/features/round/__tests__/ViewRoundPage.test.tsx b/packages/grant-explorer/src/features/round/__tests__/ViewRoundPage.test.tsx index 84c1f4222b..f1687c0e6e 100644 --- a/packages/grant-explorer/src/features/round/__tests__/ViewRoundPage.test.tsx +++ b/packages/grant-explorer/src/features/round/__tests__/ViewRoundPage.test.tsx @@ -473,7 +473,7 @@ describe(" in case of after the round start date", () => { }, 3000); }); - it.skip("shows a add-to-cart button replacing a remove-from-cart button when remove-from-balled is clicked", () => { + it("shows a add-to-cart button replacing a remove-from-cart button when remove-from-cart is clicked", () => { renderWithContext(, { roundState: { rounds: [roundWithProjects], diff --git a/packages/grant-explorer/src/index.tsx b/packages/grant-explorer/src/index.tsx index 161768f635..6b93399d6f 100644 --- a/packages/grant-explorer/src/index.tsx +++ b/packages/grant-explorer/src/index.tsx @@ -12,7 +12,7 @@ import { initTagmanager } from "./tagmanager"; import { initPosthog } from "./posthog"; import { chains, config } from "./app/wagmi"; import reportWebVitals from "./reportWebVitals"; -import { DataLayerProvider, DataLayer } from "data-layer"; +import { DataLayer, DataLayerProvider } from "data-layer"; import { getConfig } from "common/src/config"; import "./index.css"; @@ -22,11 +22,11 @@ import AccessDenied from "./features/common/AccessDenied"; import Auth from "./features/common/Auth"; import NotFound from "./features/common/NotFoundPage"; import LandingPage from "./features/discovery/LandingPage"; -import ThankYou from "./features/round/ThankYou"; +import ThankYou from "./features/cart/ThankYou"; import ViewProjectDetails from "./features/round/ViewProjectDetails"; import ViewRound from "./features/round/ViewRoundPage"; import { ViewContributionHistoryPage } from "./features/contributors/ViewContributionHistory"; -import ViewCart from "./features/round/ViewCartPage/ViewCartPage"; +import ViewCart from "./features/cart/ViewCartPage/ViewCartPage"; import { ChakraProvider } from "@chakra-ui/react"; import ExploreRoundsPage from "./features/discovery/ExploreRoundsPage";