Commit 73ccc4fed17 for woocommerce

commit 73ccc4fed1733fa7dc7b3578e7a931bd33926bf0
Author: Albert Juhé Lluveras <contact@albertjuhe.com>
Date:   Wed Jul 8 10:37:56 2026 +0200

    Preserve correct aspect ratio on Product Images with imageSizing set to cropped (#66354)

    * Preserve correct aspect ratio on Product Images with imageSizing set to cropped

    * Add changelog

    * Add extra test

diff --git a/plugins/woocommerce/changelog/fix-66338-66331-cropped-image-sizing b/plugins/woocommerce/changelog/fix-66338-66331-cropped-image-sizing
new file mode 100644
index 00000000000..7b5cdb5bbcc
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-66338-66331-cropped-image-sizing
@@ -0,0 +1,5 @@
+Significance: patch
+Type: fix
+Comment: Preserve correct aspect ratio on Product Images with imageSizing set to cropped
+
+
diff --git a/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/test/utils.test.ts b/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/test/utils.test.ts
index a401c14e5c7..ef6217ccb63 100644
--- a/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/test/utils.test.ts
+++ b/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/test/utils.test.ts
@@ -33,6 +33,17 @@ describe( 'resolveAspectRatio', () => {
 		).toBe( '4/3' );
 	} );

+	it( 'falls back to store aspect ratio when no block override is set and imageSizing is cropped', () => {
+		expect(
+			resolveAspectRatio(
+				undefined,
+				undefined,
+				'4/3',
+				ImageSizing.CROPPED
+			)
+		).toBe( '4/3' );
+	} );
+
 	it( 'returns undefined when store aspect ratio is null (uncropped)', () => {
 		expect(
 			resolveAspectRatio(
diff --git a/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/types.ts b/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/types.ts
index 2e318fde042..06c05a9b04f 100644
--- a/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/types.ts
+++ b/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/types.ts
@@ -6,6 +6,8 @@ import { ProductQueryContext } from '@woocommerce/blocks/product-query/types';
 export enum ImageSizing {
 	SINGLE = 'single',
 	THUMBNAIL = 'thumbnail',
+	// Deprecated synonym for THUMBNAIL.
+	CROPPED = 'cropped',
 }

 export type AspectRatioStyle = {
diff --git a/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/utils.ts b/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/utils.ts
index 2fa825d4c5f..96f4cf8f7ac 100644
--- a/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/utils.ts
+++ b/plugins/woocommerce/client/blocks/assets/js/atomic/blocks/product-elements/image/utils.ts
@@ -39,7 +39,11 @@ export const resolveAspectRatio = (
 		return aspectRatio;
 	}

-	if ( imageSizing && imageSizing === ImageSizing.THUMBNAIL ) {
+	if (
+		imageSizing &&
+		( imageSizing === ImageSizing.THUMBNAIL ||
+			imageSizing === ImageSizing.CROPPED )
+	) {
 		return storeAspectRatio ?? undefined;
 	}

diff --git a/plugins/woocommerce/src/Blocks/BlockTypes/ProductImage.php b/plugins/woocommerce/src/Blocks/BlockTypes/ProductImage.php
index 4c75a87b1d6..3e69abad07d 100644
--- a/plugins/woocommerce/src/Blocks/BlockTypes/ProductImage.php
+++ b/plugins/woocommerce/src/Blocks/BlockTypes/ProductImage.php
@@ -164,7 +164,8 @@ class ProductImage extends AbstractBlock {

 		// For backwards compatibility, we interpret "thumbnail" as following
 		// the store thumbnail cropping settings.
-		if ( 'thumbnail' === $attributes['imageSizing'] ) {
+		// "cropped" was used as a synonym for "thumbnail" in the past, but it's now deprecated.
+		if ( 'thumbnail' === $attributes['imageSizing'] || 'cropped' === $attributes['imageSizing'] ) {
 			return $this->get_store_thumbnail_aspect_ratio();
 		}