Add tests for shipping recommendation task (#33633)

* Move redirect function to utils to easily mock

* Add test

* Changelog

plugins/woocommerce-admin/client/tasks/fills/experimental-shipping-recommendation/shipping-recommendation.tsx

@@ -6,7 +6,6 @@ import { difference } from 'lodash';
 import { useEffect, useState } from '@wordpress/element';
 import { Stepper } from '@woocommerce/components';
 import { Card, CardBody, Button } from '@wordpress/components';
-import { getAdminLink } from '@woocommerce/settings';
 
 /**
  * Internal dependencies
@@ -16,6 +15,7 @@ import { Plugins } from './components/plugins';
 import { StoreLocation } from './components/store-location';
 import { WCSBanner } from './components/wcs-banner';
 import { TaskProps, ShippingRecommendationProps } from './types';
+import { redirectToWCSSettings } from './utils';
 
 /**
  * Plugins required to automate shipping.
@@ -35,13 +35,9 @@ export const ShippingRecommendation: React.FC<
 		setStepIndex( stepIndex + 1 );
 	};
 
-	const redirectToSettings = () => {
-		if ( window?.location ) {
-			setIsRedirecting( true );
-			window.location.href = getAdminLink(
-				'admin.php?page=wc-settings&tab=shipping&section=woocommerce-services-settings'
-			);
-		}
+	const redirect = () => {
+		setIsRedirecting( true );
+		redirectToWCSSettings();
 	};
 
 	useEffect( () => {
@@ -56,7 +52,7 @@ export const ShippingRecommendation: React.FC<
 			remainingPlugins.length === 0 &&
 			isJetpackConnected
 		) {
-			redirectToSettings();
+			redirect();
 		}
 
 		if ( remainingPlugins.length <= pluginsToActivate.length ) {
@@ -105,15 +101,11 @@ export const ShippingRecommendation: React.FC<
 				'woocommerce'
 			),
 			content: isJetpackConnected ? (
-				<Button
-					onClick={ redirectToSettings }
-					isBusy={ isRedirecting }
-					isPrimary
-				>
+				<Button onClick={ redirect } isBusy={ isRedirecting } isPrimary>
 					{ __( 'Complete task', 'woocommerce' ) }
 				</Button>
 			) : (
-				<Connect onConnect={ redirectToSettings } />
+				<Connect onConnect={ redirect } />
 			),
 		},
 	];

plugins/woocommerce-admin/client/tasks/fills/experimental-shipping-recommendation/test/shipping-recommendation.tsx

@@ -0,0 +1,123 @@
+/**
+ * External dependencies
+ */
+import { render } from '@testing-library/react';
+import { TaskType } from '@woocommerce/data';
+
+/**
+ * Internal dependencies
+ */
+import { ShippingRecommendation as _ShippingRecommendation } from '../shipping-recommendation';
+import { ShippingRecommendationProps, TaskProps } from '../types';
+import { redirectToWCSSettings } from '../utils';
+
+jest.mock( '../../tax/utils', () => ( {
+	hasCompleteAddress: jest.fn().mockReturnValue( true ),
+} ) );
+
+jest.mock( '../utils', () => ( {
+	redirectToWCSSettings: jest.fn(),
+} ) );
+
+jest.mock( '@wordpress/data', () => ( {
+	...jest.requireActual( '@wordpress/data' ),
+	useSelect: jest.fn().mockImplementation( ( fn ) =>
+		fn( () => ( {
+			getSettings: () => ( {
+				general: {
+					woocommerce_default_country: 'US',
+				},
+			} ),
+			getCountries: () => [],
+			getLocales: () => [],
+			getLocale: () => 'en',
+			hasFinishedResolution: () => true,
+			getOption: ( key: string ) => {
+				return {
+					wc_connect_options: {
+						tos_accepted: true,
+					},
+					woocommerce_setup_jetpack_opted_in: 1,
+				}[ key ];
+			},
+		} ) )
+	),
+} ) );
+
+const taskProps: TaskProps = {
+	onComplete: () => {},
+	query: {},
+	task: {
+		id: 'shipping-recommendation',
+	} as TaskType,
+};
+
+const ShippingRecommendation = ( props: ShippingRecommendationProps ) => {
+	return <_ShippingRecommendation { ...taskProps } { ...props } />;
+};
+
+describe( 'ShippingRecommendation', () => {
+	test( 'should show plugins step when jetpack is not installed and activated', () => {
+		const { getByRole } = render(
+			<ShippingRecommendation
+				isJetpackConnected={ false }
+				isResolving={ false }
+				activePlugins={ [ 'woocommerce-services' ] }
+			/>
+		);
+		expect(
+			getByRole( 'button', { name: 'Install & enable' } )
+		).toBeInTheDocument();
+	} );
+
+	test( 'should show plugins step when woocommerce-services is not installed and activated', () => {
+		const { getByRole } = render(
+			<ShippingRecommendation
+				isJetpackConnected={ false }
+				isResolving={ false }
+				activePlugins={ [ 'jetpack' ] }
+			/>
+		);
+		expect(
+			getByRole( 'button', { name: 'Install & enable' } )
+		).toBeInTheDocument();
+	} );
+
+	test( 'should show connect step when both plugins are activated', () => {
+		const { getByRole } = render(
+			<ShippingRecommendation
+				isJetpackConnected={ false }
+				isResolving={ false }
+				activePlugins={ [ 'jetpack', 'woocommerce-services' ] }
+			/>
+		);
+		expect(
+			getByRole( 'button', { name: 'Connect' } )
+		).toBeInTheDocument();
+	} );
+
+	test( 'should show "complete task" button when both plugins are activated and jetpack is connected', () => {
+		const { getByRole } = render(
+			<ShippingRecommendation
+				isJetpackConnected={ true }
+				isResolving={ false }
+				activePlugins={ [ 'jetpack', 'woocommerce-services' ] }
+			/>
+		);
+		expect(
+			getByRole( 'button', { name: 'Complete task' } )
+		).toBeInTheDocument();
+	} );
+
+	test( 'should automatically be redirected when all steps are completed', () => {
+		render(
+			<ShippingRecommendation
+				isJetpackConnected={ true }
+				isResolving={ false }
+				activePlugins={ [ 'jetpack', 'woocommerce-services' ] }
+			/>
+		);
+
+		expect( redirectToWCSSettings ).toHaveBeenCalled();
+	} );
+} );

plugins/woocommerce-admin/client/tasks/fills/experimental-shipping-recommendation/utils.ts

@@ -0,0 +1,13 @@
+/**
+ * External dependencies
+ */
+
+import { getAdminLink } from '@woocommerce/settings';
+
+export const redirectToWCSSettings = () => {
+	if ( window?.location ) {
+		window.location.href = getAdminLink(
+			'admin.php?page=wc-settings&tab=shipping&section=woocommerce-services-settings'
+		);
+	}
+};

plugins/woocommerce/changelog/add-tests-for-shipping-recommendation-task

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Add JS tests for shipping recommendation task