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