From 2de300a5ff953eb4013067fbae43ba7f8dd08676 Mon Sep 17 00:00:00 2001
From: Ankit Gade <ankit.gade@10up.com>
Date: Wed, 25 Sep 2024 18:48:02 +0530
Subject: [PATCH] Add JS tests for useCreateAccounts hook.

---
 js/src/hooks/useCreateAccounts.js      |   7 ++
 js/src/hooks/useCreateAccounts.test.js | 105 +++++++++++++++++++++++++
 2 files changed, 112 insertions(+)
 create mode 100644 js/src/hooks/useCreateAccounts.test.js

diff --git a/js/src/hooks/useCreateAccounts.js b/js/src/hooks/useCreateAccounts.js
index 3e7a71d113..272dc69a92 100644
--- a/js/src/hooks/useCreateAccounts.js
+++ b/js/src/hooks/useCreateAccounts.js
@@ -17,6 +17,13 @@ import useGoogleAdsAccount from '.~/hooks/useGoogleAdsAccount';
  * Custom hook to handle the creation of MC and Ads accounts.
  */
 const useCreateAccounts = () => {
+	/**
+	 * Refs are used to avoid the re-render of the parent component.
+	 *
+	 * accountCreationChecksResolvedRef - Indicates if the account creation checks have been resolved.
+	 * isCreatingAccountsRef - Indicates if the accounts are being created.
+	 * accountsCreatedRef - Indicates if the accounts have been created.
+	 */
 	const accountCreationChecksResolvedRef = useRef( false );
 	const isCreatingAccountsRef = useRef( false );
 	const accountsCreatedRef = useRef( false );
diff --git a/js/src/hooks/useCreateAccounts.test.js b/js/src/hooks/useCreateAccounts.test.js
new file mode 100644
index 0000000000..955e4c46f6
--- /dev/null
+++ b/js/src/hooks/useCreateAccounts.test.js
@@ -0,0 +1,105 @@
+/* eslint-disable testing-library/no-unnecessary-act */
+/**
+ * External dependencies
+ */
+import { renderHook, act } from '@testing-library/react';
+
+/**
+ * Internal dependencies
+ */
+import useCreateAccounts from './useCreateAccounts';
+import useCreateMCAccount from '../components/google-mc-account-card/useCreateMCAccount';
+import useUpsertAdsAccount from './useUpsertAdsAccount';
+import useExistingGoogleAdsAccounts from './useExistingGoogleAdsAccounts';
+import useExistingGoogleMCAccounts from './useExistingGoogleMCAccounts';
+import useGoogleAdsAccount from './useGoogleAdsAccount';
+
+jest.mock( '../components/google-mc-account-card/useCreateMCAccount' );
+jest.mock( './useUpsertAdsAccount' );
+jest.mock( './useExistingGoogleAdsAccounts' );
+jest.mock( './useExistingGoogleMCAccounts' );
+jest.mock( './useGoogleAdsAccount' );
+
+describe( 'useCreateAccounts hook', () => {
+	let handleCreateAccount;
+	let upsertAdsAccount;
+
+	beforeEach( () => {
+		handleCreateAccount = jest.fn( () => Promise.resolve() );
+		upsertAdsAccount = jest.fn( () => Promise.resolve() );
+
+		useCreateMCAccount.mockReturnValue( [
+			handleCreateAccount,
+			{ data: undefined, response: { status: 200 } },
+		] );
+		useUpsertAdsAccount.mockReturnValue( [
+			upsertAdsAccount,
+			{ loading: false },
+		] );
+		useGoogleAdsAccount.mockReturnValue( {
+			googleAdsAccount: { id: 0 },
+			hasFinishedResolution: true,
+		} );
+		useExistingGoogleMCAccounts.mockReturnValue( {
+			data: [],
+			hasFinishedResolution: true,
+		} );
+		useExistingGoogleAdsAccounts.mockReturnValue( {
+			existingAccounts: [],
+			isResolving: false,
+		} );
+	} );
+
+	it( 'should not call "handleCreateAccount" and "upsertAdsAccount" when there are existing accounts', () => {
+		// Simulate existing accounts
+		useExistingGoogleMCAccounts.mockReturnValue( {
+			data: [ { id: 1 } ],
+			hasFinishedResolution: true,
+		} );
+		useExistingGoogleAdsAccounts.mockReturnValue( {
+			existingAccounts: [ { id: 1 } ],
+			isResolving: false,
+		} );
+
+		const { result } = renderHook( () => useCreateAccounts() );
+
+		expect( result.current.isCreatingAccounts ).toBe( false );
+		expect( result.current.accountsCreated ).toBe( false );
+		expect( handleCreateAccount ).not.toHaveBeenCalled();
+		expect( upsertAdsAccount ).not.toHaveBeenCalled();
+	} );
+
+	it( 'should call "handleCreateAccount" and "upsertAdsAccount" when there are no existing accounts', async () => {
+		// Simulate the initial state and mock behavior for account creation
+		const { result, rerender } = renderHook( () => useCreateAccounts() );
+
+		expect( result.current.isCreatingAccounts ).toBe( false );
+
+		useCreateMCAccount.mockReturnValueOnce( [
+			handleCreateAccount,
+			{ data: {}, response: { status: 200 } },
+		] );
+		useUpsertAdsAccount.mockReturnValueOnce( [
+			upsertAdsAccount,
+			{ loading: false },
+		] );
+
+		await act( async () => {
+			rerender(); // Trigger the effect that begins account creation
+		} );
+
+		// At this point, isCreatingAccounts should be true
+		expect( result.current.isCreatingAccounts ).toBe( true );
+
+		await act( async () => {
+			rerender(); // Trigger the effect that begins account creation
+		} );
+
+		expect( result.current.isCreatingAccounts ).toBe( false );
+		expect( result.current.accountsCreated ).toBe( true );
+
+		// Finally, check that the functions were called correctly
+		expect( handleCreateAccount ).toHaveBeenCalledTimes( 1 );
+		expect( upsertAdsAccount ).toHaveBeenCalledTimes( 1 );
+	} );
+} );