From 3a574fdebb35799be4fb9949481e002d656ca4f1 Mon Sep 17 00:00:00 2001
From: ramonjd <ramonjd@gmail.com>
Date: Thu, 3 Nov 2022 12:24:52 +1100
Subject: [PATCH] Use find as an alternative to the deleted
 `getSelectedFontSize` method to pass the immediate, currently-selected font
 size object containing preset slug information to the consuming parent
 component. Updated tests. General post-rebase chicanery

---
 .../components/src/font-size-picker/index.tsx | 14 ++++++--
 .../src/font-size-picker/test/index.tsx       | 35 ++++++++++++++-----
 .../components/src/font-size-picker/types.ts  |  2 +-
 3 files changed, 39 insertions(+), 12 deletions(-)

diff --git a/packages/components/src/font-size-picker/index.tsx b/packages/components/src/font-size-picker/index.tsx
index 6cece5ac2f1b89..06a0b7fcf112f3 100644
--- a/packages/components/src/font-size-picker/index.tsx
+++ b/packages/components/src/font-size-picker/index.tsx
@@ -173,8 +173,13 @@ const UnforwardedFontSizePicker = (
 									onChange?.( undefined );
 								} else {
 									onChange?.(
-										hasUnits ? newValue : Number( newValue ),
-										selectedFontSize
+										hasUnits
+											? newValue
+											: Number( newValue ),
+										fontSizes.find(
+											( fontSize ) =>
+												fontSize.size === newValue
+										)
 									);
 								}
 							} }
@@ -195,7 +200,10 @@ const UnforwardedFontSizePicker = (
 							} else {
 								onChange?.(
 									hasUnits ? newValue : Number( newValue ),
-									selectedFontSize
+									fontSizes.find(
+										( fontSize ) =>
+											fontSize.size === newValue
+									)
 								);
 							}
 						} }
diff --git a/packages/components/src/font-size-picker/test/index.tsx b/packages/components/src/font-size-picker/test/index.tsx
index ff4c9a5481a2f9..3ac59bc2df1cb1 100644
--- a/packages/components/src/font-size-picker/test/index.tsx
+++ b/packages/components/src/font-size-picker/test/index.tsx
@@ -290,18 +290,37 @@ describe( 'FontSizePicker', () => {
 		);
 
 		test.each( [
-			{ option: 'Default', value: '8px', expectedValue: undefined },
-			{ option: 'Tiny 8px', value: undefined, expectedValue: '8px' },
-			{ option: 'Small 1em', value: '8px', expectedValue: '1em' },
-			{ option: 'Medium 2rem', value: '8px', expectedValue: '2rem' },
+			{
+				option: 'Default',
+				value: '8px',
+				expectedArguments: [ undefined ],
+			},
+			{
+				option: 'Tiny 8px',
+				value: undefined,
+				expectedArguments: [ '8px', fontSizes[ 0 ] ],
+			},
+			{
+				option: 'Small 1em',
+				value: '8px',
+				expectedArguments: [ '1em', fontSizes[ 1 ] ],
+			},
+			{
+				option: 'Medium 2rem',
+				value: '8px',
+				expectedArguments: [ '2rem', fontSizes[ 2 ] ],
+			},
 			{
 				option: 'Large',
 				value: '8px',
-				expectedValue: 'clamp(1.75rem, 3vw, 2.25rem)',
+				expectedArguments: [
+					'clamp(1.75rem, 3vw, 2.25rem)',
+					fontSizes[ 3 ],
+				],
 			},
 		] )(
 			'calls onChange( $expectedValue ) when $option is selected',
-			async ( { option, value, expectedValue } ) => {
+			async ( { option, value, expectedArguments } ) => {
 				const user = userEvent.setup( {
 					advanceTimers: jest.advanceTimersByTime,
 				} );
@@ -321,7 +340,7 @@ describe( 'FontSizePicker', () => {
 					screen.getByRole( 'option', { name: option } )
 				);
 				expect( onChange ).toHaveBeenCalledTimes( 1 );
-				expect( onChange ).toHaveBeenCalledWith( expectedValue );
+				expect( onChange ).toHaveBeenCalledWith( ...expectedArguments );
 			}
 		);
 
@@ -491,7 +510,7 @@ describe( 'FontSizePicker', () => {
 		test.each( [
 			{ radio: 'Small', expectedArguments: [ '12px', fontSizes[ 0 ] ] },
 			{ radio: 'Medium', expectedArguments: [ '1em', fontSizes[ 1 ] ] },
-			{ radio: 'Large', expectedArguments: [ '2em', fontSizes[ 2 ] ] },
+			{ radio: 'Large', expectedArguments: [ '2rem', fontSizes[ 2 ] ] },
 			{
 				radio: 'Extra Large',
 				expectedArguments: [
diff --git a/packages/components/src/font-size-picker/types.ts b/packages/components/src/font-size-picker/types.ts
index e5de79776a243e..24c66efe1bee28 100644
--- a/packages/components/src/font-size-picker/types.ts
+++ b/packages/components/src/font-size-picker/types.ts
@@ -24,7 +24,7 @@ export type FontSizePickerProps = {
 	 */
 	onChange?: (
 		value: number | string | undefined,
-		selectedItem?: FontSizeOption
+		selectedItem?: FontSize
 	) => void;
 	/**
 	 * The current font size value.