jest.mock("../Contexts/FileUploadContext");
jest.mock("../Contexts/VehicleContext");
jest.mock("../Contexts/UpdatesContext");
jest.mock("../Contexts/UserContext");
jest.mock("../../services/monitoring");

import { render, screen, cleanup, waitForElementToBeRemoved } from "@testing-library/react";
import { setToken } from "../Contexts/UserContext";
import { TEST_AUTH_OBJECT } from "../../utils/testing"
import App from ".";

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));
  }
  return container;
};

const check = async (path, selector, compare) => {
  const container = await renderRoute(path);
  expect(container.querySelector(selector).innerHTML).toEqual(compare);
  expect(container).toMatchSnapshot();
};

describe("App", () => {
  beforeAll(() => {
    // Stablize Table Pagination control ids 
    expect.addSnapshotSerializer({
      test: function(val) {
          return val && typeof val === "string" && val.indexOf("mui-") >= 0;
      },
      print: function(val) {
          let str = val;
          str = str.replace(/mui-[0-9]*/g, "mui-00000");        
          
          return `"${str}"`;
      }
    });
  });

  afterEach(() => {
    setToken(null);
    cleanup();
  });

  it("Route / unauthenticated", async () => {
    await check("/", "span.MuiButton-label", "Sign In");
  });

  it("Route /home unauthenticated", async () => {
    await check("/home", "span.MuiButton-label", "Sign In");
  });

  it("Route /package-upload unauthenticated", async () => {
    await check("/package-upload", "span.MuiButton-label", "Sign In");
  });

  it("Route /package-upload unauthenticated", async () => {
    const container = await renderRoute("/package-upload");
    expect(container.querySelector("span.MuiButton-label").innerHTML).toEqual("Sign In");
    expect(container).toMatchSnapshot();
  });

  it("Route /vehicle-add unauthenticated", async () => {
    await check("/vehicle-add", "span.MuiButton-label", "Sign In");
  });

  it("Route /updates unauthenticated", async () => {
    await check("/updates", "span.MuiButton-label", "Sign In");
  });

  it("Route /update unauthenticated", async () => {
    await check("/update/1", "span.MuiButton-label", "Sign In");
  });

  it("Route /carupdate-deploy unauthenticated", async () => {
    await check("/carupdate-deploy/1", "span.MuiButton-label", "Sign In");
  });

  it("Route /carupdate-status unauthenticated", async () => {
    await check("/carupdate-status/1", "span.MuiButton-label", "Sign In");
  });

  it("Route /vehicles unauthenticated", async () => {
    await check("/vehicles", "span.MuiButton-label", "Sign In");
  });

  it("Route /vehicle-status unauthenticated", async () => {
    await check("/vehicle-status/FISKER123", "span.MuiButton-label", "Sign In");
  });

  it("Route / authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/", "h1", "Welcome John!");
  });

  it("Route /home authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/home", "h1", "Welcome John!");
  });

  it("Route /package-upload authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/package-upload", "h1", "Upload Update Package");
  });

  it("Route /vehicle-add authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/vehicle-add", "h1", "Add Vehicle");
  });

  it("Route /updates authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/updates", "h1", "Updates");
  });

  it("Route /update authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/update/1", "h1", "Update Package 1");
  });

  it("Route /carupdate-deploy authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/carupdate-deploy/1", "h1", "[1]  ");
  });

  it("Route /carupdate-status authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/carupdate-status/1", "h1", "");
  });

  it("Route /vehicles authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/vehicles", "h1", "Vehicles");
  });

  it("Route /vehicle-status authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/vehicle-status/FISKER123", "h1", "FISKER123 Updates");
  });

  it("Route /page-not-found unauthenticated", async () => {
    await check("/page-not-found", "h1", "Page Not Found");
  });

  it("Route /page-not-found authenticated", async () => {
    setToken(TEST_AUTH_OBJECT);
    await check("/page-not-found", "h1", "Page Not Found");
  });
})