Add test for `wcpay_connect_account_clicked` track (#48347)

* Refactor Connect Account Page test, add wcpay_connect_account_clicked track test

* Changelog

plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx

@@ -1,23 +1,79 @@
 /**
  * External dependencies
  */
-import { render } from '@testing-library/react';
+import { render, fireEvent, screen } from '@testing-library/react';
+import { useDispatch, useSelect } from '@wordpress/data';
+import { useState } from '@wordpress/element';
 import { recordEvent } from '@woocommerce/tracks';
 
 /**
  * Internal dependencies
  */
 import ConnectAccountPage from '..';
+import { getAdminSetting } from '~/utils/admin-settings';
 
+jest.mock( '@wordpress/data', () => ( {
+	...jest.requireActual( '@wordpress/data' ),
+	useDispatch: jest.fn(),
+	useSelect: jest.fn(),
+} ) );
 jest.mock( '@woocommerce/tracks', () => ( { recordEvent: jest.fn() } ) );
+jest.mock( '~/utils/admin-settings', () => ( { getAdminSetting: jest.fn() } ) );
+jest.mock( '@wordpress/element', () => ( {
+	...jest.requireActual( '@wordpress/element' ),
+	useState: jest.fn(),
+} ) );
+jest.mock( '../apms', () => jest.fn().mockReturnValue( null ) );
+jest.mock( '../banner', () =>
+	jest.fn().mockImplementation( ( { handleSetup } ) => (
+		<div>
+			<button onClick={ handleSetup }>Handle Setup Button</button>
+		</div>
+	) )
+);
 
 describe( 'Connect Account Page', () => {
+	const setupMocks = () => {
+		( useDispatch as jest.Mock ).mockReturnValue( {
+			updateOptions: jest.fn(),
+			installAndActivatePlugins: jest.fn(),
+		} );
+		( useState as jest.Mock )
+			.mockImplementationOnce( () => [ false, jest.fn() ] ) // isSubmitted state
+			.mockImplementationOnce( () => [ '', jest.fn() ] ) // errorMessage state
+			.mockImplementationOnce( () => [ new Set(), jest.fn() ] ); // enabledApms state
+		( useSelect as jest.Mock ).mockReturnValue( {
+			isJetpackConnected: true,
+			connectUrl: '',
+		} );
+		( getAdminSetting as jest.Mock ).mockReturnValue( {
+			id: 'incentiveId',
+		} );
+	};
+
+	beforeEach( () => {
+		jest.clearAllMocks();
+		setupMocks();
+	} );
+
 	it( 'should fire custom page_view track when viewing', async () => {
 		render( <ConnectAccountPage /> );
-
 		expect( recordEvent ).toHaveBeenCalledWith( 'page_view', {
 			path: 'payments_connect_core_test',
-			incentive_id: undefined,
+			incentive_id: 'incentiveId',
 		} );
 	} );
+
+	it( 'should trigger wcpay_connect_account_clicked event when clicking connect', async () => {
+		render( <ConnectAccountPage /> );
+		fireEvent.click( screen.getByText( 'Handle Setup Button' ) );
+		expect( recordEvent ).toHaveBeenNthCalledWith(
+			2,
+			'wcpay_connect_account_clicked',
+			{
+				wpcom_connection: 'Yes',
+				incentive_id: 'incentiveId',
+			}
+		);
+	} );
 } );

plugins/woocommerce/changelog/add-test-for-payments-welcome-tracks

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Add test for wcpay_connect_account_clicked track