Add UserContext signin and signout tests
This commit is contained in:
@@ -1,10 +1,12 @@
|
|||||||
import {render, cleanup, screen, fireEvent, waitFor} from '@testing-library/react'
|
import {render, cleanup, screen, fireEvent, waitFor} from "@testing-library/react"
|
||||||
import { UserProvider, useUserContext } from '../Contexts/UserContext';
|
import { UserProvider, useUserContext } from "../Contexts/UserContext";
|
||||||
import auth from "../../services/auth";
|
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", () => {
|
describe("Signup", () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
@@ -14,10 +16,10 @@ describe('UseContext', () => {
|
|||||||
<>
|
<>
|
||||||
<div data-testid="error">{error}</div>
|
<div data-testid="error">{error}</div>
|
||||||
<div data-testid="fetching">{fetching.toString()}</div>
|
<div data-testid="fetching">{fetching.toString()}</div>
|
||||||
<button data-testid="signUpNoEmail" onClick={() => signUp('')}/>
|
<button data-testid="signUpNoEmail" onClick={() => signUp("")}/>
|
||||||
<button data-testid="signUpNoPassword" onClick={() => signUp('test@test.com', '')}/>
|
<button data-testid="signUpNoPassword" onClick={() => signUp("test@test.com", "")}/>
|
||||||
<button data-testid="signUpBadConfirm" onClick={() => signUp('test@test.com', 'password', '')}/>
|
<button data-testid="signUpBadConfirm" onClick={() => signUp("test@test.com", "password", "")}/>
|
||||||
<button data-testid="signUp" onClick={() => signUp('test@test.com', 'password', 'password')}/>
|
<button data-testid="signUp" onClick={() => signUp("test@test.com", "password", "password")}/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
@@ -29,43 +31,147 @@ describe('UseContext', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it("Initial state", () => {
|
it("Initial state", () => {
|
||||||
expect(screen.getByTestId('error').innerHTML).toEqual("");
|
expect(screen.getByTestId("error").innerHTML).toEqual("");
|
||||||
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
|
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Error with no email address", () => {
|
it("Error with no email address", () => {
|
||||||
fireEvent.click(screen.getByTestId('signUpNoEmail'));
|
fireEvent.click(screen.getByTestId("signUpNoEmail"));
|
||||||
expect(screen.getByTestId('error').innerHTML).toEqual("Email is required");
|
expect(screen.getByTestId("error").innerHTML).toEqual("Email is required");
|
||||||
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
|
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Error with no password", () => {
|
it("Error with no password", () => {
|
||||||
fireEvent.click(screen.getByTestId('signUpNoPassword'));
|
fireEvent.click(screen.getByTestId("signUpNoPassword"));
|
||||||
expect(screen.getByTestId('error').innerHTML).toEqual("Password is required");
|
expect(screen.getByTestId("error").innerHTML).toEqual("Password is required");
|
||||||
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
|
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Error with non-matching password", () => {
|
it("Error with non-matching password", () => {
|
||||||
fireEvent.click(screen.getByTestId('signUpBadConfirm'));
|
fireEvent.click(screen.getByTestId("signUpBadConfirm"));
|
||||||
expect(screen.getByTestId('error').innerHTML).toEqual("Passwords do not match");
|
expect(screen.getByTestId("error").innerHTML).toEqual("Passwords do not match");
|
||||||
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
|
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
|
||||||
});
|
});
|
||||||
|
|
||||||
it("No error sign up", async () => {
|
it("No error sign up", async () => {
|
||||||
fireEvent.click(screen.getByTestId('signUp'));
|
fireEvent.click(screen.getByTestId("signUp"));
|
||||||
await waitFor(() => {
|
await waitFor(() => {
|
||||||
expect(screen.getByTestId('error').innerHTML).toEqual("");
|
expect(screen.getByTestId("error").innerHTML).toEqual("");
|
||||||
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
|
expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Handle server error", async () => {
|
it("Handle server error", async () => {
|
||||||
auth.setSignUpResponse({ message: "SERVER-ERROR", error: "ERR" });
|
auth.setSignUpResponse({ message: "SERVER-ERROR", error: "ERR" });
|
||||||
fireEvent.click(screen.getByTestId('signUp'));
|
fireEvent.click(screen.getByTestId("signUp"));
|
||||||
await waitFor(() => {
|
await waitFor(() => {
|
||||||
expect(screen.getByTestId('error').innerHTML).toEqual("SERVER-ERROR");
|
expect(screen.getByTestId("error").innerHTML).toEqual("SERVER-ERROR");
|
||||||
expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
|
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();
|
||||||
|
})
|
||||||
|
})
|
||||||
});
|
});
|
||||||
Reference in New Issue
Block a user