fix: resolve renderHook related test errors (#2839)

ArkEcosystem · Sep 18, 2020 · 231e889 · 231e889
1 parent 5e8e46c
commit 231e889
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 16 deletions.
diff --git a/src/domains/transaction/components/AuthenticationStep/AuthenticationStep.test.tsx b/src/domains/transaction/components/AuthenticationStep/AuthenticationStep.test.tsx
@@ -1,9 +1,9 @@
 import { Profile, ReadWriteWallet } from "@arkecosystem/platform-sdk-profiles";
-import { renderHook } from "@testing-library/react-hooks";
+import { act, renderHook } from "@testing-library/react-hooks";
 import { Form } from "app/components/Form";
 import React from "react";
 import { useForm } from "react-hook-form";
-import { act, env, fireEvent, getDefaultProfileId, renderWithRouter, screen, waitFor } from "utils/testing-library";
+import { env, fireEvent, getDefaultProfileId, renderWithRouter, screen, waitFor } from "utils/testing-library";
 
 import { AuthenticationStep } from "./AuthenticationStep";
 
@@ -25,11 +25,11 @@ describe("AuthenticationStep", () => {
 	it("should request mnemonic", async () => {
 		jest.spyOn(wallet, "isSecondSignature").mockReturnValueOnce(false);
 
-		const { result } = renderHook(() => useForm({ mode: "onChange" }));
+		const { result } = renderHook(() => useForm({ mode: "onChange", shouldUnregister: false }));
 		const { asFragment } = renderWithRouter(<Component form={result.current} />);
 
 		await waitFor(() => expect(screen.queryByTestId("AuthenticationStep__second-mnemonic")).toBeNull());
-		expect(screen.queryByTestId("AuthenticationStep__mnemonic")).toBeInTheDocument();
+		await waitFor(() => expect(screen.queryByTestId("AuthenticationStep__mnemonic")).toBeInTheDocument());
 
 		act(() => {
 			fireEvent.input(screen.getByTestId("AuthenticationStep__mnemonic"), {
@@ -39,18 +39,18 @@ describe("AuthenticationStep", () => {
 			});
 		});
 
-		expect(result.current.getValues()).toEqual({ mnemonic: "my mnemonic" });
+		await waitFor(() => expect(result.current.getValues()).toEqual({ mnemonic: "my mnemonic" }));
 		expect(asFragment()).toMatchSnapshot();
 	});
 
-	it("should request mnemonic and second mnemonic", () => {
+	it("should request mnemonic and second mnemonic", async () => {
 		jest.spyOn(wallet, "isSecondSignature").mockReturnValueOnce(true);
 
-		const { result } = renderHook(() => useForm({ mode: "onChange" }));
+		const { result } = renderHook(() => useForm({ mode: "onChange", shouldUnregister: false }));
 		const { asFragment } = renderWithRouter(<Component form={result.current} />);
 
-		expect(screen.queryByTestId("AuthenticationStep__second-mnemonic")).toBeInTheDocument();
-		expect(screen.queryByTestId("AuthenticationStep__mnemonic")).toBeInTheDocument();
+		await waitFor(() => expect(screen.queryByTestId("AuthenticationStep__mnemonic")).toBeInTheDocument());
+		await waitFor(() => expect(screen.queryByTestId("AuthenticationStep__second-mnemonic")).toBeInTheDocument());
 
 		act(() => {
 			fireEvent.input(screen.getByTestId("AuthenticationStep__mnemonic"), {
@@ -68,19 +68,24 @@ describe("AuthenticationStep", () => {
 			});
 		});
 
-		expect(result.current.getValues()).toEqual({ mnemonic: "my mnemonic", secondMnemonic: "my second mnemonic" });
+		await waitFor(() =>
+			expect(result.current.getValues()).toEqual({
+				mnemonic: "my mnemonic",
+				secondMnemonic: "my second mnemonic",
+			}),
+		);
 		expect(asFragment()).toMatchSnapshot();
 	});
 
-	it("should show only ledger confirmation", () => {
+	it("should show only ledger confirmation", async () => {
 		jest.spyOn(wallet, "isLedger").mockReturnValueOnce(true);
 
-		const { result } = renderHook(() => useForm({ mode: "onChange" }));
+		const { result } = renderHook(() => useForm({ mode: "onChange", shouldUnregister: false }));
 		const { asFragment } = renderWithRouter(<Component form={result.current} />);
 
-		expect(screen.queryByTestId("LedgerConfirmation-description")).toBeInTheDocument();
-		expect(screen.queryByTestId("AuthenticationStep__second-mnemonic")).toBeNull();
-		expect(screen.queryByTestId("AuthenticationStep__mnemonic")).toBeNull();
+		await waitFor(() => expect(screen.queryByTestId("LedgerConfirmation-description")).toBeInTheDocument());
+		await waitFor(() => expect(screen.queryByTestId("AuthenticationStep__mnemonic")).toBeNull());
+		await waitFor(() => expect(screen.queryByTestId("AuthenticationStep__second-mnemonic")).toBeNull());
 
 		expect(asFragment()).toMatchSnapshot();
 	});

diff --git a/...ction/components/SecondSignatureRegistrationForm/SecondSignatureRegistrationForm.test.tsx b/...ction/components/SecondSignatureRegistrationForm/SecondSignatureRegistrationForm.test.tsx
@@ -7,8 +7,9 @@ import { Form } from "app/components/Form";
 import React from "react";
 import { useForm } from "react-hook-form";
 import { useTranslation } from "react-i18next";
+import { act } from "react-test-renderer";
 import secondSignatureFixture from "tests/fixtures/coins/ark/transactions/second-signature-registration.json";
-import { act, env, fireEvent, getDefaultProfileId, render, screen, waitFor } from "utils/testing-library";
+import { env, fireEvent, getDefaultProfileId, render, screen, waitFor } from "utils/testing-library";
 
 import { translations as transactionTranslations } from "../../i18n";
 import { SecondSignatureRegistrationForm } from "./SecondSignatureRegistrationForm";
@@ -70,6 +71,7 @@ describe("SecondSignatureRegistrationForm", () => {
 
 	it("should set fee", async () => {
 		const { result } = renderHook(() => useForm());
+
 		result.current.register("fee");
 
 		render(<Component form={result.current} onSubmit={() => void 0} />);