diff --git a/plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx b/plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx
index f9e277c946b..8bd05af1190 100644
--- a/plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx
+++ b/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 } ) => (
+
+
+
+ ) )
+);
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( );
-
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( );
+ fireEvent.click( screen.getByText( 'Handle Setup Button' ) );
+ expect( recordEvent ).toHaveBeenNthCalledWith(
+ 2,
+ 'wcpay_connect_account_clicked',
+ {
+ wpcom_connection: 'Yes',
+ incentive_id: 'incentiveId',
+ }
+ );
+ } );
} );
diff --git a/plugins/woocommerce/changelog/add-test-for-payments-welcome-tracks b/plugins/woocommerce/changelog/add-test-for-payments-welcome-tracks
new file mode 100644
index 00000000000..88bfd9a52e7
--- /dev/null
+++ b/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