no log: Add unit tests to all pages

frontend/src/App/app.test.tsx

@@ -1,14 +1,9 @@
 import { render } from "@/tests";
-import { StrictMode } from "react";
 import { describe, it } from "vitest";
 import App from ".";
 
 describe("App", () => {
   it("should render without crash", () => {
-    render(
-      <StrictMode>
-        <App />
-      </StrictMode>
-    );
+    render(<App />);
   });
 });

frontend/src/App/index.tsx

@@ -4,7 +4,7 @@ import { Layout } from "@/constants";
 import NavbarProvider from "@/contexts/Navbar";
 import OnlineProvider from "@/contexts/Online";
 import { notification } from "@/modules/task";
-import CriticalError from "@/pages/CriticalError";
+import CriticalError from "@/pages/errors/CriticalError";
 import { RouterNames } from "@/Router/RouterNames";
 import { Environment } from "@/utilities";
 import { AppShell } from "@mantine/core";

frontend/src/Router/index.tsx

@@ -6,12 +6,12 @@ import Authentication from "@/pages/Authentication";
 import BlacklistMoviesView from "@/pages/Blacklist/Movies";
 import BlacklistSeriesView from "@/pages/Blacklist/Series";
 import Episodes from "@/pages/Episodes";
+import NotFound from "@/pages/errors/NotFound";
 import MoviesHistoryView from "@/pages/History/Movies";
 import SeriesHistoryView from "@/pages/History/Series";
 import MovieView from "@/pages/Movies";
 import MovieDetailView from "@/pages/Movies/Details";
 import MovieMassEditor from "@/pages/Movies/Editor";
-import NotFound from "@/pages/NotFound";
 import SeriesView from "@/pages/Series";
 import SeriesMassEditor from "@/pages/Series/Editor";
 import SettingsGeneralView from "@/pages/Settings/General";

frontend/src/components/ErrorBoundary.tsx

@@ -1,4 +1,4 @@
-import UIError from "@/pages/UIError";
+import UIError from "@/pages/errors/UIError";
 import { Component } from "react";
 
 interface State {

frontend/src/modules/socketio/index.ts

@@ -1,7 +1,7 @@
 import { debounce, forIn, remove, uniq } from "lodash";
 import { onlineManager } from "react-query";
 import { io, Socket } from "socket.io-client";
-import { Environment, isDevEnv } from "../../utilities";
+import { Environment, isDevEnv, isTestEnv } from "../../utilities";
 import { ENSURE, GROUP, LOG } from "../../utilities/console";
 import { createDefaultReducer } from "./reducer";
 
@@ -51,6 +51,10 @@ class SocketIOClient {
   }
 
   initialize() {
+    if (isTestEnv) {
+      return;
+    }
+
     LOG("info", "Initializing Socket.IO client...");
     this.reducers.push(...createDefaultReducer());
 

frontend/src/pages/Blacklist/blacklist.test.tsx

@@ -0,0 +1,16 @@
+import { renderTest, RenderTestCase } from "@/tests/render";
+import BlacklistMoviesView from "./Movies";
+import BlacklistSeriesView from "./Series";
+
+const cases: RenderTestCase[] = [
+  {
+    name: "movie page",
+    ui: BlacklistMoviesView,
+  },
+  {
+    name: "series page",
+    ui: BlacklistSeriesView,
+  },
+];
+
+renderTest("Blacklist", cases);

frontend/src/pages/History/history.test.tsx

@@ -0,0 +1,21 @@
+import { renderTest, RenderTestCase } from "@/tests/render";
+import MoviesHistoryView from "./Movies";
+import SeriesHistoryView from "./Series";
+import HistoryStats from "./Statistics";
+
+const cases: RenderTestCase[] = [
+  {
+    name: "movie page",
+    ui: MoviesHistoryView,
+  },
+  {
+    name: "series page",
+    ui: SeriesHistoryView,
+  },
+  {
+    name: "statistics page",
+    ui: HistoryStats,
+  },
+];
+
+renderTest("History", cases);

frontend/src/pages/Movies/movies.test.tsx

@@ -0,0 +1,16 @@
+import { render } from "@/tests";
+import { describe } from "vitest";
+import MovieView from ".";
+import MovieMassEditor from "./Editor";
+
+describe("Movies page", () => {
+  it("should render", () => {
+    render(<MovieView />);
+  });
+});
+
+describe("Movies editor page", () => {
+  it("should render", () => {
+    render(<MovieMassEditor />);
+  });
+});

frontend/src/pages/Series/series.test.tsx

@@ -0,0 +1,16 @@
+import { render } from "@/tests";
+import { describe } from "vitest";
+import SeriesView from ".";
+import SeriesMassEditor from "./Editor";
+
+describe("Series page", () => {
+  it("should render", () => {
+    render(<SeriesView />);
+  });
+});
+
+describe("Series editor page", () => {
+  it("should render", () => {
+    render(<SeriesMassEditor />);
+  });
+});

frontend/src/pages/Settings/settings.test.tsx

@@ -0,0 +1,51 @@
+import { renderTest, RenderTestCase } from "@/tests/render";
+import SettingsGeneralView from "./General";
+import SettingsLanguagesView from "./Languages";
+import SettingsNotificationsView from "./Notifications";
+import SettingsProvidersView from "./Providers";
+import SettingsRadarrView from "./Radarr";
+import SettingsSchedulerView from "./Scheduler";
+import SettingsSonarrView from "./Sonarr";
+import SettingsSubtitlesView from "./Subtitles";
+import SettingsUIView from "./UI";
+
+const cases: RenderTestCase[] = [
+  {
+    name: "general page",
+    ui: SettingsGeneralView,
+  },
+  {
+    name: "languages page",
+    ui: SettingsLanguagesView,
+  },
+  {
+    name: "notifications page",
+    ui: SettingsNotificationsView,
+  },
+  {
+    name: "providers page",
+    ui: SettingsProvidersView,
+  },
+  {
+    name: "radarr page",
+    ui: SettingsRadarrView,
+  },
+  {
+    name: "scheduler page",
+    ui: SettingsSchedulerView,
+  },
+  {
+    name: "sonarr page",
+    ui: SettingsSonarrView,
+  },
+  {
+    name: "subtitles page",
+    ui: SettingsSubtitlesView,
+  },
+  {
+    name: "ui page",
+    ui: SettingsUIView,
+  },
+];
+
+renderTest("Settings", cases);

frontend/src/pages/System/system.test.tsx

@@ -0,0 +1,36 @@
+import { renderTest, RenderTestCase } from "@/tests/render";
+import SystemBackupsView from "./Backups";
+import SystemLogsView from "./Logs";
+import SystemProvidersView from "./Providers";
+import SystemReleasesView from "./Releases";
+import SystemStatusView from "./Status";
+import SystemTasksView from "./Tasks";
+
+const cases: RenderTestCase[] = [
+  {
+    name: "backups page",
+    ui: SystemBackupsView,
+  },
+  {
+    name: "logs page",
+    ui: SystemLogsView,
+  },
+  {
+    name: "providers page",
+    ui: SystemProvidersView,
+  },
+  {
+    name: "releases page",
+    ui: SystemReleasesView,
+  },
+  {
+    name: "status page",
+    ui: SystemStatusView,
+  },
+  {
+    name: "tasks page",
+    ui: SystemTasksView,
+  },
+];
+
+renderTest("System", cases);

frontend/src/pages/Wanted/wanted.test.tsx

@@ -0,0 +1,16 @@
+import { renderTest, RenderTestCase } from "@/tests/render";
+import WantedMoviesView from "./Movies";
+import WantedSeriesView from "./Series";
+
+const cases: RenderTestCase[] = [
+  {
+    name: "movie page",
+    ui: WantedMoviesView,
+  },
+  {
+    name: "series page",
+    ui: WantedSeriesView,
+  },
+];
+
+renderTest("Wanted", cases);

frontend/src/pages/errors/errors.test.tsx

@@ -0,0 +1,22 @@
+import { render } from "@/tests";
+import CriticalError from "./CriticalError";
+import NotFound from "./NotFound";
+import UIError from "./UIError";
+
+describe("Not found page", () => {
+  it("should display message", () => {
+    render(<NotFound />);
+  });
+});
+
+describe("Critical error page", () => {
+  it("should disable error", () => {
+    render(<CriticalError message="Test error"></CriticalError>);
+  });
+});
+
+describe("UI error page", () => {
+  it("should disable error", () => {
+    render(<UIError error={new Error("Test error")}></UIError>);
+  });
+});

frontend/src/tests/index.tsx

@@ -1,11 +1,19 @@
 import { AllProviders } from "@/providers";
 import { render, RenderOptions } from "@testing-library/react";
-import { ReactElement } from "react";
+import { FunctionComponent, ReactElement, StrictMode } from "react";
+
+const AllProvidersWithStrictMode: FunctionComponent = ({ children }) => {
+  return (
+    <StrictMode>
+      <AllProviders>{children}</AllProviders>
+    </StrictMode>
+  );
+};
 
 const customRender = (
   ui: ReactElement,
   options?: Omit<RenderOptions, "wrapper">
-) => render(ui, { wrapper: AllProviders, ...options });
+) => render(ui, { wrapper: AllProvidersWithStrictMode, ...options });
 
 // re-export everything
 export * from "@testing-library/react";

frontend/src/tests/render.tsx

@@ -0,0 +1,17 @@
+import { FunctionComponent } from "react";
+import { render } from ".";
+
+export interface RenderTestCase {
+  name: string;
+  ui: FunctionComponent;
+}
+
+export function renderTest(name: string, cases: RenderTestCase[]) {
+  describe(name, () => {
+    cases.forEach((element) => {
+      it(`${element.name.toLowerCase()} should render`, () => {
+        render(<element.ui />);
+      });
+    });
+  });
+}

frontend/test/setup.ts

@@ -26,3 +26,5 @@ class ResizeObserver {
 }
 
 window.ResizeObserver = ResizeObserver;
+
+window.scrollTo = () => {};