Refactor rendering

This commit is contained in:
jwu-fisker
2021-01-07 08:10:09 -08:00
parent 812b91ee74
commit bd7d15721d

View File

@@ -1,75 +1,68 @@
jest.mock("../Contexts/UserContext"); jest.mock("../Contexts/UserContext");
import { render, screen, cleanup, waitFor } from "@testing-library/react" import { render, screen, cleanup, waitForElementToBeRemoved, waitFor } from "@testing-library/react"
import { setToken } from "../Contexts/UserContext"; import { setToken } from "../Contexts/UserContext";
import App from "."; import App from ".";
const TEST_TOKEN = { accessToken: { jwtToken: "TEST" }}; const TEST_TOKEN = { accessToken: { jwtToken: "TEST" }};
const LOADING_STATUS = "Loading...";
const renderRoute = async (route) => {
window.history.pushState({}, "", route);
const { container } = render(<App />);
if (screen.queryByText(LOADING_STATUS)) {
await waitForElementToBeRemoved(() => screen.getByText(LOADING_STATUS));
} else {
await waitFor(() => {});
}
return container;
};
describe.only("App", () => { describe.only("App", () => {
it ("Route / unauthenticated", async () => { it("Route / unauthenticated", async () => {
setToken(null); setToken(null);
window.history.pushState({}, "", "/"); const container = await renderRoute("/");
const { container } = render(<App />);
// need 2 cycles to render due to routes
await waitFor(() => {});
await waitFor(() => {});
expect(container).toMatchSnapshot(); expect(container).toMatchSnapshot();
expect(container.querySelector("h1").innerHTML).toEqual("Sign in"); expect(container.querySelector("h1").innerHTML).toEqual("Sign in");
cleanup(); cleanup();
}); });
it ("Route /signup unauthenticated", async () => { it("Route /signup unauthenticated", async () => {
setToken(null); setToken(null);
window.history.pushState({}, "", "/signup"); const container = await renderRoute("/signup");
const { container } = render(<App />);
await waitFor(() => {});
await waitFor(() => {});
expect(container).toMatchSnapshot(); expect(container).toMatchSnapshot();
expect(container.querySelector("h1").innerHTML).toEqual("Sign up"); expect(container.querySelector("h1").innerHTML).toEqual("Sign up");
cleanup(); cleanup();
}); });
it ("Route /home unauthenticated", async () => { it("Route /home unauthenticated", async () => {
setToken(null); setToken(null);
window.history.pushState({}, "", "/home"); const container = await renderRoute("/home");
const { container } = render(<App />);
await waitFor(() => {});
await waitFor(() => {});
expect(container).toMatchSnapshot(); expect(container).toMatchSnapshot();
expect(container.querySelector("h1").innerHTML).toEqual("Sign in"); expect(container.querySelector("h1").innerHTML).toEqual("Sign in");
cleanup(); cleanup();
}); });
it ("Route / authenticated", async () => { it("Route / authenticated", async () => {
setToken(TEST_TOKEN); setToken(TEST_TOKEN);
window.history.pushState({}, "", "/"); const container = await renderRoute("/");
const { container } = render(<App />);
await waitFor(() => {});
await waitFor(() => {});
expect(container).toMatchSnapshot(); expect(container).toMatchSnapshot();
expect(container.querySelector("h1").innerHTML).toEqual("Upload file"); expect(container.querySelector("h1").innerHTML).toEqual("Upload file");
cleanup(); cleanup();
}); });
it ("Route /signup authenticated", async () => { it("Route /signup authenticated", async () => {
setToken(TEST_TOKEN); setToken(TEST_TOKEN);
window.history.pushState({}, "", "/signup"); const container = await renderRoute("/signup");
const { container } = render(<App />);
await waitFor(() => {});
await waitFor(() => {});
expect(container).toMatchSnapshot(); expect(container).toMatchSnapshot();
expect(container.querySelector("h1").innerHTML).toEqual("Upload file"); expect(container.querySelector("h1").innerHTML).toEqual("Upload file");
cleanup(); cleanup();
}); });
it ("Route /home authenticated", async () => { it("Route /home authenticated", async () => {
setToken(TEST_TOKEN); setToken(TEST_TOKEN);
window.history.pushState({}, "", "/home"); const container = await renderRoute("/home");
const { container } = render(<App />);
await waitFor(() => {});
await waitFor(() => {});
expect(container).toMatchSnapshot(); expect(container).toMatchSnapshot();
expect(container.querySelector("h1").innerHTML).toEqual("Upload file"); expect(container.querySelector("h1").innerHTML).toEqual("Upload file");
cleanup(); cleanup();