Add UserContext signin and signout tests

This commit is contained in:
jwu-fisker
2021-01-06 18:53:17 -08:00
parent c96d6ec751
commit 59e3339d46

View File

@@ -1,10 +1,12 @@
import {render, cleanup, screen, fireEvent, waitFor} from '@testing-library/react'
import { UserProvider, useUserContext } from '../Contexts/UserContext';
import {render, cleanup, screen, fireEvent, waitFor} from "@testing-library/react"
import { UserProvider, useUserContext } from "../Contexts/UserContext";
import auth from "../../services/auth";
jest.mock('../../services/auth');
const TEST_TOKEN = { accessToken: { jwtToken: "TEST" }};
describe('UseContext', () => {
jest.mock("../../services/auth");
describe("UseContext", () => {
describe("Signup", () => {
beforeEach(() => {
@@ -14,10 +16,10 @@ describe('UseContext', () => {
<>
<div data-testid="error">{error}</div>
<div data-testid="fetching">{fetching.toString()}</div>
<button data-testid="signUpNoEmail" onClick={() => signUp('')}/>
<button data-testid="signUpNoPassword" onClick={() => signUp('test@test.com', '')}/>
<button data-testid="signUpBadConfirm" onClick={() => signUp('test@test.com', 'password', '')}/>
<button data-testid="signUp" onClick={() => signUp('test@test.com', 'password', 'password')}/>
<button data-testid="signUpNoEmail" onClick={() => signUp("")}/>
<button data-testid="signUpNoPassword" onClick={() => signUp("test@test.com", "")}/>
<button data-testid="signUpBadConfirm" onClick={() => signUp("test@test.com", "password", "")}/>
<button data-testid="signUp" onClick={() => signUp("test@test.com", "password", "password")}/>
</>
);
};
@@ -29,43 +31,147 @@ describe('UseContext', () => {
});
it("Initial state", () => {
expect(screen.getByTestId('error').innerHTML).toEqual("");
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
expect(screen.getByTestId("error").innerHTML).toEqual("");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
});
it("Error with no email address", () => {
fireEvent.click(screen.getByTestId('signUpNoEmail'));
expect(screen.getByTestId('error').innerHTML).toEqual("Email is required");
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
fireEvent.click(screen.getByTestId("signUpNoEmail"));
expect(screen.getByTestId("error").innerHTML).toEqual("Email is required");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
});
it("Error with no password", () => {
fireEvent.click(screen.getByTestId('signUpNoPassword'));
expect(screen.getByTestId('error').innerHTML).toEqual("Password is required");
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
fireEvent.click(screen.getByTestId("signUpNoPassword"));
expect(screen.getByTestId("error").innerHTML).toEqual("Password is required");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
});
it("Error with non-matching password", () => {
fireEvent.click(screen.getByTestId('signUpBadConfirm'));
expect(screen.getByTestId('error').innerHTML).toEqual("Passwords do not match");
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
fireEvent.click(screen.getByTestId("signUpBadConfirm"));
expect(screen.getByTestId("error").innerHTML).toEqual("Passwords do not match");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
});
it("No error sign up", async () => {
fireEvent.click(screen.getByTestId('signUp'));
fireEvent.click(screen.getByTestId("signUp"));
await waitFor(() => {
expect(screen.getByTestId('error').innerHTML).toEqual("");
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
expect(screen.getByTestId("error").innerHTML).toEqual("");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
});
});
it("Handle server error", async () => {
auth.setSignUpResponse({ message: "SERVER-ERROR", error: "ERR" });
fireEvent.click(screen.getByTestId('signUp'));
fireEvent.click(screen.getByTestId("signUp"));
await waitFor(() => {
expect(screen.getByTestId('error').innerHTML).toEqual("SERVER-ERROR");
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
expect(screen.getByTestId("error").innerHTML).toEqual("SERVER-ERROR");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
});
auth.setSignUpResponse({});
});
});
describe("Signin", () => {
beforeEach(() => {
const TestComp = () => {
const { signIn, error, token, fetching } = useUserContext();
return (
<>
<div data-testid="error">{error}</div>
<div data-testid="fetching">{fetching.toString()}</div>
<div data-testid="token">{JSON.stringify(token)}</div>
<button data-testid="signInNoEmail" onClick={() => signIn("")}/>
<button data-testid="signInNoPassword" onClick={() => signIn("test@test.com", "")}/>
<button data-testid="signIn" onClick={() => signIn("test@test.com", "password", "password")}/>
</>
);
};
render(<UserProvider><TestComp /></UserProvider>);
});
afterEach(() => {
cleanup();
});
it("Initial state", () => {
expect(screen.getByTestId("error").innerHTML).toEqual("");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
expect(screen.getByTestId("token").innerHTML).toEqual("null");
});
it("Error with no email address", () => {
fireEvent.click(screen.getByTestId("signInNoEmail"));
expect(screen.getByTestId("error").innerHTML).toEqual("Email is required");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
expect(screen.getByTestId("token").innerHTML).toEqual("null");
});
it("Error with no password", () => {
fireEvent.click(screen.getByTestId("signInNoPassword"));
expect(screen.getByTestId("error").innerHTML).toEqual("Password is required");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
expect(screen.getByTestId("token").innerHTML).toEqual("null");
});
it("No error sign in", async () => {
auth.setSignInResponse(TEST_TOKEN);
fireEvent.click(screen.getByTestId("signIn"));
await waitFor(() => {
const TOKEN_STRING = JSON.stringify(TEST_TOKEN);
expect(screen.getByTestId("error").innerHTML).toEqual("");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
expect(screen.getByTestId("token").innerHTML).toEqual(TOKEN_STRING);
if (!sessionStorage) return;
expect(sessionStorage.getItem("token")).toEqual(TOKEN_STRING);
sessionStorage.removeItem("token");
});
});
it("Handle server error", async () => {
auth.setSignInResponse({ message: "SERVER-ERROR", error: "ERR" });
fireEvent.click(screen.getByTestId("signIn"));
await waitFor(() => {
expect(screen.getByTestId("error").innerHTML).toEqual("SERVER-ERROR");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
});
auth.setSignUpResponse({});
});
});
describe("Signout", () => {
beforeEach(async () => {
const TestComp = () => {
const { signIn, signOut, error, token, fetching } = useUserContext();
return (
<>
<div data-testid="error">{error}</div>
<div data-testid="fetching">{fetching.toString()}</div>
<div data-testid="token">{JSON.stringify(token)}</div>
<button data-testid="signIn" onClick={() => signIn("test@test.com", "password", "password")}/>
<button data-testid="signOut" onClick={() => signOut()}/>
</>
);
};
render(<UserProvider><TestComp /></UserProvider>);
auth.setSignInResponse(TEST_TOKEN);
fireEvent.click(screen.getByTestId("signIn"));
await waitFor(() => {});
});
afterEach(() => {
auth.setSignInResponse({});
cleanup();
});
it("Token cleared", () => {
fireEvent.click(screen.getByTestId("signOut"));
expect(screen.getByTestId("error").innerHTML).toEqual("");
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
expect(screen.getByTestId("token").innerHTML).toEqual("null");
if (!sessionStorage) return;
expect(sessionStorage.getItem('token')).toBeNull();
})
})
});