Fix incompability of Query Pagination block with Product Collection (#47749)

* Amend Query Pagination parent OR ancestor array and include product collection

* Rename the function and amend comment

* Add changelog

* Remove some leftovers

* Tets if it's possible to insert multiple Pagination blocks in Product Collection

* Add awaits to expects

* Update plugins/woocommerce-blocks/assets/js/blocks/product-collection/utils.tsx

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>

* Add comment explaining the condition

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>

plugins/woocommerce-blocks/assets/js/blocks/product-collection/index.tsx

@@ -13,7 +13,7 @@ import icon from './icon';
 import registerProductSummaryVariation from './variations/elements/product-summary';
 import registerProductTitleVariation from './variations/elements/product-title';
 import registerCollections from './collections';
-import { addProductCollectionBlockToParentOfPaginationBlock } from './utils';
+import { addProductCollectionToQueryPaginationParentOrAncestor } from './utils';
 
 registerBlockType( metadata, {
 	icon,
@@ -23,4 +23,4 @@ registerBlockType( metadata, {
 registerProductSummaryVariation();
 registerProductTitleVariation();
 registerCollections();
-addProductCollectionBlockToParentOfPaginationBlock();
+addProductCollectionToQueryPaginationParentOrAncestor();

plugins/woocommerce-blocks/assets/js/blocks/product-collection/utils.tsx

@@ -96,26 +96,36 @@ export function getDefaultValueOfInheritQueryFromTemplate() {
 }
 
 /**
- * Add Product Collection block to the parent array of the Core Pagination block.
+ * Add Product Collection block to the parent or ancestor array of the Core Pagination block.
  * This enhancement allows the Core Pagination block to be available for the Product Collection block.
  */
-export const addProductCollectionBlockToParentOfPaginationBlock = () => {
+export const addProductCollectionToQueryPaginationParentOrAncestor = () => {
 	if ( isWpVersion( '6.1', '>=' ) ) {
 		addFilter(
 			'blocks.registerBlockType',
 			'woocommerce/add-product-collection-block-to-parent-array-of-pagination-block',
 			( blockSettings: Block, blockName: string ) => {
-				if (
-					blockName !== coreQueryPaginationBlockName ||
-					! blockSettings?.parent
-				) {
+				if ( blockName !== coreQueryPaginationBlockName ) {
 					return blockSettings;
 				}
 
-				return {
-					...blockSettings,
-					parent: [ ...blockSettings.parent, blockJson.name ],
-				};
+				if ( blockSettings?.ancestor ) {
+					return {
+						...blockSettings,
+						ancestor: [ ...blockSettings.ancestor, blockJson.name ],
+					};
+				}
+
+				// Below condition is to support WP >=6.4 where Pagination specifies the parent.
+				// Can be removed when minimum WP version is set to 6.5 and higher.
+				if ( blockSettings?.parent ) {
+					return {
+						...blockSettings,
+						parent: [ ...blockSettings.parent, blockJson.name ],
+					};
+				}
+
+				return blockSettings;
 			}
 		);
 	}

plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts

@@ -10,15 +10,11 @@ import type { Request } from '@playwright/test';
 import ProductCollectionPage, { SELECTORS } from './product-collection.page';
 
 const test = base.extend< { pageObject: ProductCollectionPage } >( {
-	pageObject: async (
-		{ page, admin, editor, templateApiUtils, editorUtils },
-		use
-	) => {
+	pageObject: async ( { page, admin, editor, editorUtils }, use ) => {
 		const pageObject = new ProductCollectionPage( {
 			page,
 			admin,
 			editor,
-			templateApiUtils,
 			editorUtils,
 		} );
 		await use( pageObject );
@@ -880,6 +876,29 @@ test.describe( 'Product Collection', () => {
 				featuredProductsPrices
 			);
 		} );
+
+		test( 'With multiple Pagination blocks', async ( {
+			page,
+			admin,
+			editor,
+			editorUtils,
+			pageObject,
+		} ) => {
+			await admin.createNewPost();
+			await pageObject.insertProductCollection();
+			await pageObject.chooseCollectionInPost( 'productCatalog' );
+			const paginations = page.getByLabel( 'Block: Pagination' );
+
+			await expect( paginations ).toHaveCount( 1 );
+
+			const siblingBlock = await editorUtils.getBlockByName(
+				'woocommerce/product-template'
+			);
+			await editor.selectBlocks( siblingBlock );
+			await editorUtils.insertBlockUsingGlobalInserter( 'Pagination' );
+
+			await expect( paginations ).toHaveCount( 2 );
+		} );
 	} );
 
 	test.describe( 'Location is recognised', () => {

plugins/woocommerce/changelog/47717-incompability-with-blocks-from-builders-at-pagination-to-top-and-cannot-duplicate-the-pagiantion-block-at-the-recent-updates

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Product Collection: fix the incompatibility of Query Pagination block with Product Collection