Add unit tests for 4 wcadmin tracks (#47876)

* Add unit test for pageview on non-embedded layout component

* Add tracks test for payments welcome page

* Add test for task completion track

* Update completion track to use get_json instead for more accurate coverage

* Changelog

* Lint

* Add test for tasklist item click

* Change test name

plugins/woocommerce-admin/client/layout/test/index.js

@@ -131,7 +131,7 @@ describe( 'updateLinkHref', () => {
 	} );
 } );
 
-describe( 'Layout', () => {
+describe( 'EmbedLayout', () => {
 	it( 'should call recordPageView with correct parameters', () => {
 		window.history.pushState( {}, 'Page Title', '/url?search' );
 		render( <EmbedLayout /> );
@@ -148,6 +148,7 @@ describe( 'PageLayout', () => {
 			jest.fn()
 		);
 		jest.useFakeTimers();
+		jest.clearAllMocks();
 	} );
 
 	afterEach( () => {
@@ -163,6 +164,17 @@ describe( 'PageLayout', () => {
 		mockedGetHistory.mockReturnValue( historyMock );
 	}
 
+	it( 'should call recordPageView with correct parameters', () => {
+		mockPath( '/analytics/overview' );
+		render( <PageLayout /> );
+		expect( recordPageView ).toHaveBeenCalledWith( 'analytics_overview', {
+			has_navigation: true,
+			jetpack_active: false,
+			jetpack_connected: false,
+			jetpack_installed: false,
+		} );
+	} );
+
 	describe( 'NoMatch', () => {
 		const message = 'Sorry, you are not allowed to access this page.';
 

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

@@ -0,0 +1,23 @@
+/**
+ * External dependencies
+ */
+import { render } from '@testing-library/react';
+import { recordEvent } from '@woocommerce/tracks';
+
+/**
+ * Internal dependencies
+ */
+import ConnectAccountPage from '..';
+
+jest.mock( '@woocommerce/tracks', () => ( { recordEvent: jest.fn() } ) );
+
+describe( 'Connect Account Page', () => {
+	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,
+		} );
+	} );
+} );

plugins/woocommerce-admin/client/task-lists/components/test/task-list-item.test.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { act, render } from '@testing-library/react';
+import { act, render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { SlotFillProvider } from '@wordpress/components';
 import { useDispatch } from '@wordpress/data';
@@ -41,6 +41,7 @@ const mockDispatch = {
 	snoozeTask: jest.fn(),
 	undoDismissTask: jest.fn(),
 	undoSnoozeTask: jest.fn(),
+	visitedTask: jest.fn(),
 };
 ( useDispatch as jest.Mock ).mockReturnValue( mockDispatch );
 
@@ -52,7 +53,10 @@ jest.mock( '@woocommerce/data', () => {
 	const originalModule = jest.requireActual( '@woocommerce/data' );
 	return {
 		...originalModule,
-		useUserPreferences: jest.fn(),
+		useUserPreferences: jest.fn().mockReturnValue( {
+			task_list_tracked_started_tasks: 0,
+			updateUserPreferences: jest.fn(),
+		} ),
 	};
 } );
 jest.mock( '@woocommerce/experimental', () => {
@@ -62,9 +66,10 @@ jest.mock( '@woocommerce/experimental', () => {
 		useSlot: jest.fn(),
 		TaskItem: jest
 			.fn()
-			.mockImplementation( ( { title, onSnooze, onDismiss } ) => (
+			.mockImplementation(
+				( { title, onSnooze, onDismiss, onClick } ) => (
 					<div>
-					<span>{ title }</span>
+						<button onClick={ onClick }>{ title }</button>
 						{ onSnooze && (
 							<button onClick={ onSnooze } name="Snooze">
 								Snooze
@@ -76,7 +81,16 @@ jest.mock( '@woocommerce/experimental', () => {
 							</button>
 						) }
 					</div>
-			) ),
+				)
+			),
+	};
+} );
+jest.mock( '@woocommerce/navigation', () => {
+	return {
+		getPersistedQuery: jest.fn().mockReturnValue( {} ),
+		navigateTo: jest.fn(),
+		getNewPath: jest.fn(),
+		addHistoryListener: jest.fn(),
 	};
 } );
 
@@ -174,6 +188,25 @@ describe( 'TaskListItem', () => {
 		);
 	} );
 
+	it( 'should trigger tasklist_click event when clicking tasklist item', () => {
+		render(
+			<TaskListItem
+				task={ { ...task } }
+				isExpandable={ false }
+				isExpanded={ false }
+				setExpandedTask={ () => {} }
+			/>
+		);
+		act( () => {
+			userEvent.click( screen.getByText( task.title ) );
+		} );
+
+		expect( recordEvent ).toHaveBeenCalledWith( 'tasklist_click', {
+			context: 'home',
+			task_name: task.id,
+		} );
+	} );
+
 	it( 'should not call dismissTask when isDismissable is set to false', () => {
 		const { queryByRole } = render(
 			<TaskListItem

plugins/woocommerce/changelog/add-tracks-unit-tests-improvements

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Implement unit test for tracks wcadmin_page_view, wcadmin_tasklist_view, wcadmin_tasklist_task_completed, wcadmin_tasklist_click

plugins/woocommerce/tests/legacy/unit-tests/woocommerce-admin/features/onboarding-tasks/task.php

@@ -322,5 +322,68 @@ class WC_Admin_Tests_OnboardingTasks_Task extends WC_Unit_Test_Case {
 
 		$this->assertEquals( 'extended_tasklist_test_event', $task->record_tracks_event( 'test_event' ) );
 	}
-}
 
+	/**
+	 * Test completion track when task is completed but not yet tracked and called via get_json.
+	 */
+	public function test_record_tracks_event_completion_success() {
+		$mock = $this->getMockBuilder( TestTask::class )
+			->onlyMethods( array( 'record_tracks_event', 'has_previously_completed' ) )
+			->setConstructorArgs(
+				array(
+					new TaskList( array( 'id' => 'extended' ) ),
+					array(
+						'id' => 'wc-unit-test-task',
+					),
+				)
+			)
+			->getMock();
+
+		$mock->method( 'has_previously_completed' )
+			->willReturn( false );
+		$mock->is_complete = true;
+
+		$mock->expects( $this->once() )
+			->method( 'record_tracks_event' );
+
+		$mock->get_json();
+	}
+
+	/**
+	 * Test completion track when task is not completed.
+	 */
+	public function test_record_tracks_event_completion_not_complete() {
+		$mock = $this->getMockBuilder( TestTask::class )
+			->onlyMethods( array( 'record_tracks_event', 'has_previously_completed' ) )
+			->disableOriginalConstructor()
+			->getMock();
+
+		$mock->method( 'has_previously_completed' )
+			->willReturn( false );
+		$mock->is_complete = false;
+
+		$mock->expects( $this->never() )
+			->method( 'record_tracks_event' );
+
+		$mock->possibly_track_completion();
+	}
+
+	/**
+	 * Test completion track when task is completed but already tracked.
+	 */
+	public function test_record_tracks_event_completion_already_tracked() {
+		$mock = $this->getMockBuilder( TestTask::class )
+			->onlyMethods( array( 'record_tracks_event', 'has_previously_completed' ) )
+			->disableOriginalConstructor()
+			->getMock();
+
+		$mock->method( 'has_previously_completed' )
+			->willReturn( true );
+		$mock->is_complete = false;
+
+		$mock->expects( $this->never() )
+			->method( 'record_tracks_event' );
+
+		$mock->possibly_track_completion();
+	}
+}