Homepage: Add tracks events to Stats List period changes (https://github.com/woocommerce/woocommerce-admin/pull/4448)

plugins/woocommerce-admin/client/homepage/stats-overview/index.js

@@ -102,6 +102,11 @@ export const StatsOverview = ( { userPrefs, updateCurrentUserData } ) => {
 		>
 			<TabPanel
 				className="woocommerce-stats-overview__tabs"
+				onSelect={ ( period ) => {
+					recordEvent( 'statsoverview_date_picker_update', {
+						period,
+					} );
+				} }
 				tabs={ [
 					{
 						title: __( 'Today', 'woocommerce-admin' ),

plugins/woocommerce-admin/client/homepage/stats-overview/test/index.js

@@ -50,6 +50,29 @@ describe( 'StatsOverview tracking', () => {
 			}
 		);
 	} );
+
+	it( 'should record an event when a period is clicked', () => {
+		render(
+			<StatsOverview
+				userPrefs={ {
+					hiddenStats: null,
+				} }
+				updateCurrentUserData={ () => {} }
+			/>
+		);
+
+		const monthBtn = screen.getByRole( 'tab', {
+			name: 'Month to date',
+		} );
+		fireEvent.click( monthBtn );
+
+		expect( recordEvent ).toHaveBeenCalledWith(
+			'statsoverview_date_picker_update',
+			{
+				period: 'month',
+			}
+		);
+	} );
 } );
 
 describe( 'StatsOverview toggle and persist stat preference', () => {