Skip to content

Commit

Permalink
Correctly mocked useNavigate Hook for Donors.test (#237)
Browse files Browse the repository at this point in the history
Refers to #231 
Earlier due to issues with useNavigate tests were failing , which have
now been refactored.
A Few of the older tests have been refactored , new tests for donorview
to be written soon.
Raising PR to put in a donor page tests back in the repo . Also removing
donors.txt from repo
  • Loading branch information
TanviMahajan11 authored May 11, 2023
2 parents f9a3ecc + afdd75d commit b5ba1bb
Show file tree
Hide file tree
Showing 2 changed files with 71 additions and 140 deletions.
140 changes: 0 additions & 140 deletions frontend/src/__tests__/donor.txt

This file was deleted.

71 changes: 71 additions & 0 deletions frontend/src/__tests__/donors.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
import React from "react";
import { render, fireEvent, screen } from "@testing-library/react";
import { useNavigate } from "react-router-dom";
import Donor from "../pages/donors";

jest.mock("react-router-dom", () => ({
useNavigate: jest.fn(),
}));

describe("Donor component", () => {
it("Checks Rendering of donor page by checking Donor List Text Presence", () => {
const navigate = jest.fn();
(useNavigate as jest.Mock).mockReturnValue(navigate);
const { getByText } = render(<Donor />);
const heading = getByText(/Donor List/i);
expect(heading).toBeInTheDocument();
});
it("renders Add Donor button", () => {
const navigate = jest.fn();
(useNavigate as jest.Mock).mockReturnValue(navigate);
const { getByText } = render(<Donor />);
const addButton = getByText(/Add Donor/i);
expect(addButton).toBeInTheDocument();
});
it("renders Lookup Donor button", () => {
const navigate = jest.fn();
(useNavigate as jest.Mock).mockReturnValue(navigate);
const { getByText } = render(<Donor />);
const addButton = getByText(/Lookup Donor/i);
expect(addButton).toBeInTheDocument();
});
it("displays an error message if the no email address is provided in the Email Address field of the add donor dialog", () => {
const navigate = jest.fn();
(useNavigate as jest.Mock).mockReturnValue(navigate);
const { getByRole, getByLabelText, getByText, queryByText } = render(
<Donor />
);
const addDonorButton = getByRole("button", { name: "Add Donor" });
fireEvent.click(addDonorButton);
const personID = getByLabelText("Person ID")
const emailInput = getByLabelText("Email");
const addButton = getByText("Add");
expect(addButton).toBeDisabled();
//First we put in dummy text
fireEvent.change(emailInput, { target: { value: "zyzz" } });
fireEvent.change(personID, { target: { value: "2" } });
//Removing the dummy text to initiate warning message
fireEvent.change(emailInput, { target: { value: "" } });
fireEvent.click(addButton);
expect(queryByText("Email is required")).toBeInTheDocument();
});
it("displays an error message if the email address is invalid in the add donor dialog", () => {
const navigate = jest.fn();
(useNavigate as jest.Mock).mockReturnValue(navigate);
const { getByRole, getByLabelText, getByText, queryByText } = render(
<Donor />
);
const addDonorButton = getByRole("button", { name: "Add Donor" });
fireEvent.click(addDonorButton);
const emailInput = getByLabelText("Email");
const addButton = getByText("Add");
//Add button should be initially disabled
expect(addButton).toBeDisabled();
//Entering an invalid email
fireEvent.change(emailInput, { target: { value: "invalid_email" } });
fireEvent.click(addButton);
//Error message should be displayed
expect(queryByText("Email is invalid")).toBeInTheDocument();
});

});

0 comments on commit b5ba1bb

Please sign in to comment.