From b65a4f83303b2a137c91b98f9f38e898e6d20535 Mon Sep 17 00:00:00 2001 From: Gregor Billing Date: Sat, 2 Jul 2022 13:16:27 +0900 Subject: [PATCH] Migrate test hooks to React 18 render pipeline --- tnoodle-ui/src/test/App.test.tsx | 22 +++++-------------- tnoodle-ui/src/test/EntryInterface.test.tsx | 9 +++----- tnoodle-ui/src/test/EventPicker.test.tsx | 11 ++++------ tnoodle-ui/src/test/EventPickerTable.test.tsx | 11 ++++------ tnoodle-ui/src/test/Main.test.tsx | 7 ++---- tnoodle-ui/src/test/SideBar.test.tsx | 6 ++--- tnoodle-ui/src/test/VersionInfo.test.tsx | 17 ++++++-------- 7 files changed, 28 insertions(+), 55 deletions(-) diff --git a/tnoodle-ui/src/test/App.test.tsx b/tnoodle-ui/src/test/App.test.tsx index 0fca04536..ee585e903 100644 --- a/tnoodle-ui/src/test/App.test.tsx +++ b/tnoodle-ui/src/test/App.test.tsx @@ -1,21 +1,12 @@ -import { configureStore } from "@reduxjs/toolkit"; -import { fireEvent } from "@testing-library/react"; +import { render, act, fireEvent } from "@testing-library/react"; import { shuffle } from "lodash"; import React from "react"; -import { render, unmountComponentAtNode } from "react-dom"; -import { act } from "react-dom/test-utils"; import { Provider } from "react-redux"; import App from "../App"; import tnoodleApi from "../main/api/tnoodle.api"; import wcaApi from "../main/api/wca.api"; import Translation from "../main/model/Translation"; import Wcif from "../main/model/Wcif"; -import { competitionSlice } from "../main/redux/slice/CompetitionSlice"; -import { fmcSlice } from "../main/redux/slice/FmcSlice"; -import { informationSlice } from "../main/redux/slice/InformationSlice"; -import { mbldSlice } from "../main/redux/slice/MbldSlice"; -import { scramblingSlice } from "../main/redux/slice/ScramblingSlice"; -import { wcifSlice } from "../main/redux/slice/WcifSlice"; import { defaultWcif } from "../main/util/wcif.util"; import { bestMbldAttempt, @@ -94,7 +85,6 @@ beforeEach(() => { afterEach(() => { // cleanup on exiting - unmountComponentAtNode(container); container.remove(); container = document.createElement("div"); @@ -126,7 +116,7 @@ it("Just generate scrambles", async () => { , - container + { container } ); }); const scrambleButton = container.querySelector("form button")!; @@ -154,7 +144,7 @@ it("Changes on 333, scramble", async () => { , - container + { container } ); }); @@ -227,7 +217,7 @@ it("Remove 333, add FMC and MBLD", async () => { , - container + { container } ); }); @@ -361,7 +351,7 @@ it("Logged user", async () => { , - container + { container } ); }); @@ -489,7 +479,7 @@ it("Comfort features should not block zip generation", async () => { , - container + { container } ); }); diff --git a/tnoodle-ui/src/test/EntryInterface.test.tsx b/tnoodle-ui/src/test/EntryInterface.test.tsx index 3d0d488d7..f87dcb20e 100644 --- a/tnoodle-ui/src/test/EntryInterface.test.tsx +++ b/tnoodle-ui/src/test/EntryInterface.test.tsx @@ -1,7 +1,5 @@ -import { fireEvent } from "@testing-library/react"; +import { render, act, fireEvent } from "@testing-library/react"; import React from "react"; -import { render, unmountComponentAtNode } from "react-dom"; -import { act } from "react-dom/test-utils"; import { Provider } from "react-redux"; import EntryInterface from "../main/components/EntryInterface"; import store from "../main/redux/Store"; @@ -15,7 +13,6 @@ beforeEach(() => { afterEach(() => { // cleanup on exiting - unmountComponentAtNode(container); container.remove(); container = document.createElement("div"); }); @@ -29,7 +26,7 @@ it("Competition name should be already filled with current date and changes shou , - container + { container } ); }); @@ -58,7 +55,7 @@ it("Password should toggle and changes to it should go to the store", async () = , - container + { container } ); }); diff --git a/tnoodle-ui/src/test/EventPicker.test.tsx b/tnoodle-ui/src/test/EventPicker.test.tsx index f455dc458..07c27dfc6 100644 --- a/tnoodle-ui/src/test/EventPicker.test.tsx +++ b/tnoodle-ui/src/test/EventPicker.test.tsx @@ -1,7 +1,5 @@ -import { fireEvent } from "@testing-library/react"; +import { render, act, fireEvent } from "@testing-library/react"; import React from "react"; -import { render, unmountComponentAtNode } from "react-dom"; -import { act } from "react-dom/test-utils"; import { Provider } from "react-redux"; import EventPicker from "../main/components/EventPicker"; import { @@ -23,7 +21,6 @@ beforeEach(() => { afterEach(() => { // cleanup on exiting - unmountComponentAtNode(container); container.remove(); container = document.createElement("div"); }); @@ -43,7 +40,7 @@ it("Changing values from event", async () => { , - container + { container } ); }); @@ -127,7 +124,7 @@ it("Editing disabled", async () => { , - container + { container } ); }); @@ -157,7 +154,7 @@ it("Progress Bar showing/hiding", async () => { , - container + { container } ); }); diff --git a/tnoodle-ui/src/test/EventPickerTable.test.tsx b/tnoodle-ui/src/test/EventPickerTable.test.tsx index 86053b59c..6eaa7ff47 100644 --- a/tnoodle-ui/src/test/EventPickerTable.test.tsx +++ b/tnoodle-ui/src/test/EventPickerTable.test.tsx @@ -1,7 +1,5 @@ -import { fireEvent } from "@testing-library/react"; +import { render, act, fireEvent } from "@testing-library/react"; import React from "react"; -import { render, unmountComponentAtNode } from "react-dom"; -import { act } from "react-dom/test-utils"; import { Provider } from "react-redux"; import tnoodleApi from "../main/api/tnoodle.api"; import EventPickerTable from "../main/components/EventPickerTable"; @@ -36,7 +34,6 @@ beforeEach(() => { afterEach(() => { // cleanup on exiting - unmountComponentAtNode(container); container.remove(); container = document.createElement("div"); @@ -78,7 +75,7 @@ it("Show editing warn if case of competition selected", async () => { , - container + { container } ); }); @@ -116,7 +113,7 @@ it("Singular event", async () => { , - container + { container } ); }); @@ -135,7 +132,7 @@ it("Changes in MBLD should go to the store", async () => { , - container + { container } ); }); const names = ["3x3x3 Multiple Blindfolded"]; diff --git a/tnoodle-ui/src/test/Main.test.tsx b/tnoodle-ui/src/test/Main.test.tsx index 70c38ffe5..e8b666ad8 100644 --- a/tnoodle-ui/src/test/Main.test.tsx +++ b/tnoodle-ui/src/test/Main.test.tsx @@ -1,7 +1,5 @@ -import { fireEvent } from "@testing-library/react"; +import { render, act, fireEvent } from "@testing-library/react"; import React from "react"; -import { render, unmountComponentAtNode } from "react-dom"; -import { act } from "react-dom/test-utils"; import { Provider } from "react-redux"; import tnoodleApi from "../main/api/tnoodle.api"; import wcaApi from "../main/api/wca.api"; @@ -36,7 +34,6 @@ beforeEach(() => { afterEach(() => { // cleanup on exiting - unmountComponentAtNode(container); container.remove(); container = document.createElement("div"); @@ -82,7 +79,7 @@ it("There should be only 1 button of type submit, check FMC changes", async () =
, - container + { container } ); }); diff --git a/tnoodle-ui/src/test/SideBar.test.tsx b/tnoodle-ui/src/test/SideBar.test.tsx index e866bba11..d854d404f 100644 --- a/tnoodle-ui/src/test/SideBar.test.tsx +++ b/tnoodle-ui/src/test/SideBar.test.tsx @@ -1,7 +1,6 @@ import React from "react"; -import { act } from "react-dom/test-utils"; -import { render, unmountComponentAtNode } from "react-dom"; +import { render, act } from "@testing-library/react"; import { Provider } from "react-redux"; import store from "../main/redux/Store"; @@ -21,7 +20,6 @@ beforeEach(() => { afterEach(() => { // cleanup on exiting - unmountComponentAtNode(container); container.remove(); container = document.createElement("div"); }); @@ -44,7 +42,7 @@ it("Each competition fetched from the website must become a button", async () => , - container + { container } ); }); diff --git a/tnoodle-ui/src/test/VersionInfo.test.tsx b/tnoodle-ui/src/test/VersionInfo.test.tsx index 7062bffeb..ac8b037f9 100644 --- a/tnoodle-ui/src/test/VersionInfo.test.tsx +++ b/tnoodle-ui/src/test/VersionInfo.test.tsx @@ -1,7 +1,5 @@ import React from "react"; -import { act } from "react-dom/test-utils"; - -import { render, unmountComponentAtNode } from "react-dom"; +import { render, act } from "@testing-library/react"; import { Provider } from "react-redux"; @@ -20,7 +18,6 @@ beforeEach(() => { afterEach(() => { // cleanup on exiting - unmountComponentAtNode(container); container.remove(); container = document.createElement("div"); }); @@ -62,7 +59,7 @@ it("Current version is the correct one", async () => { , - container + { container } ); }); @@ -114,7 +111,7 @@ it("Current version is allowed, but it's not the latest one", async () => { , - container + { container } ); }); @@ -170,7 +167,7 @@ it("Not signed version alert", async () => { , - container + { container } ); }); @@ -223,7 +220,7 @@ it("Signed with different key", async () => { , - container + { container } ); }); @@ -276,7 +273,7 @@ it("Not allowed TNoodle version, despite it's official", async () => { , - container + { container } ); }); @@ -322,7 +319,7 @@ it("Do not bother the user if we can't be sure", async () => { , - container + { container } ); });