From f6b412572a06fb4bec82f0b4fc85e7874954c42f Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 11:05:10 +0100 Subject: [PATCH 01/22] Prepare test cases --- .../product-collection.block_theme.spec.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 8baa78eafe56..120dfd91ec5b 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -47,6 +47,16 @@ test.describe( 'Product Collection', () => { await expect( pageObject.addToCartButtons ).toHaveCount( 9 ); } ); + test.describe( 'Renders correctly with all Product Elements', async () => { + test( 'In a post', async ( { pageObject } ) => {} ); + + test( 'In a Product Archive (Product Catalog)', async ( { + pageObject, + } ) => {} ); + + test( 'On a Home Page', async ( { pageObject } ) => {} ); + } ); + test.describe( 'Product Collection Sidebar Settings', () => { test.beforeEach( async ( { pageObject } ) => { await pageObject.createNewPostAndInsertBlock(); From 426626074882af9e5e9144250e9f8c68d18bfab8 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 12:12:14 +0100 Subject: [PATCH 02/22] Shorten out the test description --- .../product-collection/product-collection.block_theme.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 120dfd91ec5b..691b951be1de 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -326,7 +326,7 @@ test.describe( 'Product Collection', () => { await expect( pageObject.products ).toHaveCount( 4 ); } ); - test.describe( 'Sync with current template (former "Inherit query from template")', () => { + test.describe( 'Sync with current template', () => { test( 'should not be visible on posts', async ( { pageObject, } ) => { From 9d51f78c96663aaa3e30645f008b6bed6722c356 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 13:13:02 +0100 Subject: [PATCH 03/22] Add first test in a post with dummy expect --- .../product-collection.block_theme.spec.ts | 40 ++++++++++++++++++- .../product-collection.page.ts | 20 ++++++++++ 2 files changed, 59 insertions(+), 1 deletion(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 691b951be1de..94f75d83f93f 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -48,7 +48,45 @@ test.describe( 'Product Collection', () => { } ); test.describe( 'Renders correctly with all Product Elements', async () => { - test( 'In a post', async ( { pageObject } ) => {} ); + const insertProductElements = async ( { pageObject } ) => { + // By default there are inner blocks: + // - woocommerce/product-image + // - core/post-title + // - woocommerce/product-price + // - woocommerce/product-image + // We're adding remaining ones + const productElements = [ + { name: 'woocommerce/product-rating', attributes: {} }, + { name: 'woocommerce/product-sku', attributes: {} }, + { name: 'woocommerce/product-stock-indicator', attributes: {} }, + { name: 'woocommerce/product-summary', attributes: {} }, + { name: 'woocommerce/product-rating', attributes: {} }, + { + name: 'core/post-terms', + attributes: { term: 'product_tag' }, + }, + { + name: 'core/post-terms', + attributes: { term: 'product_cat' }, + }, + ]; + + await Promise.all( + productElements.map( async ( productElement ) => { + await pageObject.insertBlockInProductCollection( + productElement + ); + } ) + ); + }; + + test( 'In a post', async ( { pageObject } ) => { + await pageObject.createNewPostAndInsertBlock(); + await insertProductElements( { pageObject } ); + await pageObject.publishAndGoToFrontend(); + expect( pageObject.productTemplate ).not.toBeNull(); + // EXPECT + } ); test( 'In a Product Archive (Product Catalog)', async ( { pageObject, diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts index c2e3231aa300..3addbb58ac17 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts @@ -127,6 +127,7 @@ class ProductCollectionPage { async createNewPostAndInsertBlock( collection?: Collections ) { await this.admin.createNewPost( { legacyCanvas: true } ); + await this.editorUtils.closeWelcomeGuideModal(); await this.insertProductCollection(); await this.chooseCollectionInPost( collection ); await this.refreshLocators( 'editor' ); @@ -516,6 +517,25 @@ class ProductCollectionPage { await this.page.setViewportSize( { width, height } ); } + async insertBlockInProductCollection( block: { + name: string; + attributes: object; + } ) { + await this.waitForProductsToLoad(); + const productTemplate = await this.editorUtils.getBlockByName( + 'woocommerce/product-template' + ); + const productTemplateId = + ( await productTemplate.getAttribute( 'data-block' ) ) ?? ''; + + await this.editor.selectBlocks( productTemplate ); + await this.editorUtils.insertBlock( + block, + undefined, + productTemplateId + ); + } + async insertProductCollectionInSingleProductBlock() { this.insertSingleProductBlock(); From 9d35567864d0e51a390c70b038315b7bc04f7bc8 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 14:53:51 +0100 Subject: [PATCH 04/22] Verify all content is displayed --- .../product-collection.block_theme.spec.ts | 28 ++++++++++++++----- 1 file changed, 21 insertions(+), 7 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 94f75d83f93f..f05a34bd15d1 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -2,7 +2,7 @@ * External dependencies */ import { test as base, expect } from '@woocommerce/e2e-playwright-utils'; -import type { Request } from '@playwright/test'; +import type { Request, Locator } from '@playwright/test'; /** * Internal dependencies @@ -80,19 +80,33 @@ test.describe( 'Product Collection', () => { ); }; + const verifyFirstProductContent = ( firstProduct: Locator ) => { + expect( firstProduct ).toContainText( 'Album' ); + expect( firstProduct ).toContainText( '$15.00' ); + expect( firstProduct ).toContainText( 'No Reviews' ); + expect( firstProduct ).toContainText( 'SKU: WOO-ALBUM' ); + expect( firstProduct ).toContainText( 'In stock' ); + expect( firstProduct ).toContainText( 'No Reviews' ); + expect( firstProduct ).toContainText( 'No tags' ); + expect( firstProduct ).toContainText( 'Music' ); + }; + test( 'In a post', async ( { pageObject } ) => { await pageObject.createNewPostAndInsertBlock(); + await expect( pageObject.products ).toHaveCount( 9 ); await insertProductElements( { pageObject } ); await pageObject.publishAndGoToFrontend(); - expect( pageObject.productTemplate ).not.toBeNull(); - // EXPECT + + const firstProduct = pageObject.products.first(); + + verifyFirstProductContent( firstProduct ); } ); - test( 'In a Product Archive (Product Catalog)', async ( { - pageObject, - } ) => {} ); + // test( 'In a Product Archive (Product Catalog)', async ( { + // pageObject, + // } ) => {} ); - test( 'On a Home Page', async ( { pageObject } ) => {} ); + // test( 'On a Home Page', async ( { pageObject } ) => {} ); } ); test.describe( 'Product Collection Sidebar Settings', () => { From 596ec512ea5e448a5a176e256007e31de8a9c048 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 15:11:57 +0100 Subject: [PATCH 05/22] Add the test in Product Archive and Home Page --- .../product-collection.block_theme.spec.ts | 31 ++++++++++++++--- .../product-collection.page.ts | 34 +++++++++++++++---- 2 files changed, 55 insertions(+), 10 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index f05a34bd15d1..cebf3171e5f0 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -102,11 +102,34 @@ test.describe( 'Product Collection', () => { verifyFirstProductContent( firstProduct ); } ); - // test( 'In a Product Archive (Product Catalog)', async ( { - // pageObject, - // } ) => {} ); + test( 'In a Product Archive (Product Catalog)', async ( { + pageObject, + editor, + } ) => { + await pageObject.replaceProductsWithProductCollectionInTemplate( + 'woocommerce/woocommerce//archive-product' + ); + await expect( pageObject.products ).toHaveCount( 9 ); + await insertProductElements( { pageObject } ); + await editor.saveSiteEditorEntities(); + await pageObject.goToProductCatalogFrontend(); + + const firstProduct = pageObject.products.first(); + + verifyFirstProductContent( firstProduct ); + } ); + + test( 'On a Home Page', async ( { pageObject, editor } ) => { + await pageObject.goToHomePageAndInsertCollection(); + await expect( pageObject.products ).toHaveCount( 9 ); + await insertProductElements( { pageObject } ); + await editor.saveSiteEditorEntities(); + await pageObject.goToProductCatalogFrontend(); - // test( 'On a Home Page', async ( { pageObject } ) => {} ); + const firstProduct = pageObject.products.first(); + + verifyFirstProductContent( firstProduct ); + } ); } ); test.describe( 'Product Collection Sidebar Settings', () => { diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts index 3addbb58ac17..d26c9f2919c8 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts @@ -5,6 +5,11 @@ import { Locator, Page } from '@playwright/test'; import { TemplateApiUtils, EditorUtils } from '@woocommerce/e2e-utils'; import { Editor, Admin } from '@wordpress/e2e-test-utils-playwright'; +/** + * Internal dependencies + */ +import { BLOCK_THEME_SLUG } from '../../utils/constants'; + export const SELECTORS = { productTemplate: '.wc-block-product-template', product: '.wc-block-product-template .wc-block-product', @@ -196,13 +201,12 @@ class ProductCollectionPage { await this.editor.insertBlock( { name: this.BLOCK_SLUG } ); } - async goToProductCatalogAndInsertCollection( collection?: Collections ) { - await this.templateApiUtils.revertTemplate( - 'woocommerce/woocommerce//archive-product' - ); - + async goToTemplateAndInsertCollection( + postId: string, + collection?: Collections + ) { await this.admin.visitSiteEditor( { - postId: 'woocommerce/woocommerce//archive-product', + postId, postType: 'wp_template', } ); await this.editorUtils.waitForSiteEditorFinishLoading(); @@ -213,6 +217,24 @@ class ProductCollectionPage { await this.editor.saveSiteEditorEntities(); } + async goToHomePageAndInsertCollection( collection?: Collections ) { + await this.goToTemplateAndInsertCollection( + `${ BLOCK_THEME_SLUG }//home`, + collection + ); + } + + async goToProductCatalogAndInsertCollection( collection?: Collections ) { + await this.templateApiUtils.revertTemplate( + 'woocommerce/woocommerce//archive-product' + ); + + await this.goToTemplateAndInsertCollection( + 'woocommerce/woocommerce//archive-product', + collection + ); + } + async searchProducts( phrase: string ) { await this.page .getByLabel( SELECTORS.productSearchLabel ) From 3ce43765e23c3eaf7ace448838d4e274bb7efb73 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 15:13:25 +0100 Subject: [PATCH 06/22] Add changelog --- ...ollection-add-e2e-tests-with-all-product-elements-included | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 plugins/woocommerce/changelog/45214-product-collection-add-e2e-tests-with-all-product-elements-included diff --git a/plugins/woocommerce/changelog/45214-product-collection-add-e2e-tests-with-all-product-elements-included b/plugins/woocommerce/changelog/45214-product-collection-add-e2e-tests-with-all-product-elements-included new file mode 100644 index 000000000000..5af5682f2b81 --- /dev/null +++ b/plugins/woocommerce/changelog/45214-product-collection-add-e2e-tests-with-all-product-elements-included @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +Product Collection: Add E2E tests confirming all Product Elements are rendered correctly From d94d0a5ebd43f81f6f3f93920fa89dfb99cb64c5 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 16:01:41 +0100 Subject: [PATCH 07/22] Add tag to Beanie product --- plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh | 1 + 1 file changed, 1 insertion(+) diff --git a/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh b/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh index 63658d69042d..a0f9894fb471 100644 --- a/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh +++ b/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh @@ -24,6 +24,7 @@ wp post meta update $hoodie_product_id _product_image_gallery "$image1,$image2,$ # Create a tag, so we can add tests for tag-related blocks and templates. tag_id=$(wp wc product_tag create --name="Recommended" --slug="recommended" --description="Curated products selected by our experts" --porcelain --user=1) wp wc product update $hoodie_product_id --tags="[ { \"id\": $tag_id } ]" --user=1 +wp wc product update $beanie_product_id --tags="[ { \"id\": $tag_id } ]" --user=1 # This is a non-hacky work around to set up the cross sells product. cap_product_id=$(wp post list --post_type=product --field=ID --name="Cap" --format=ids) From da88101f0d67503b9e9ba6b4b0c49194a895c76d Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 16:03:33 +0100 Subject: [PATCH 08/22] Switch to Beanie which is on sale to verify on sale badge --- .../product-collection.block_theme.spec.ts | 32 +++++++------------ 1 file changed, 12 insertions(+), 20 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index cebf3171e5f0..09ec29df1530 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -53,14 +53,14 @@ test.describe( 'Product Collection', () => { // - woocommerce/product-image // - core/post-title // - woocommerce/product-price - // - woocommerce/product-image + // - woocommerce/product-button // We're adding remaining ones const productElements = [ { name: 'woocommerce/product-rating', attributes: {} }, { name: 'woocommerce/product-sku', attributes: {} }, { name: 'woocommerce/product-stock-indicator', attributes: {} }, { name: 'woocommerce/product-summary', attributes: {} }, - { name: 'woocommerce/product-rating', attributes: {} }, + { name: 'woocommerce/product-sale-badge', attributes: {} }, { name: 'core/post-terms', attributes: { term: 'product_tag' }, @@ -80,26 +80,18 @@ test.describe( 'Product Collection', () => { ); }; - const verifyFirstProductContent = ( firstProduct: Locator ) => { - expect( firstProduct ).toContainText( 'Album' ); - expect( firstProduct ).toContainText( '$15.00' ); - expect( firstProduct ).toContainText( 'No Reviews' ); - expect( firstProduct ).toContainText( 'SKU: WOO-ALBUM' ); - expect( firstProduct ).toContainText( 'In stock' ); - expect( firstProduct ).toContainText( 'No Reviews' ); - expect( firstProduct ).toContainText( 'No tags' ); - expect( firstProduct ).toContainText( 'Music' ); + expect( product ).toContainText( 'SALE' ); // woocommerce/product-sale-badge }; test( 'In a post', async ( { pageObject } ) => { await pageObject.createNewPostAndInsertBlock(); await expect( pageObject.products ).toHaveCount( 9 ); - await insertProductElements( { pageObject } ); + await insertProductElements( pageObject ); await pageObject.publishAndGoToFrontend(); - const firstProduct = pageObject.products.first(); + const product = pageObject.products.nth( 2 ); - verifyFirstProductContent( firstProduct ); + verifyProductContent( product ); } ); test( 'In a Product Archive (Product Catalog)', async ( { @@ -110,25 +102,25 @@ test.describe( 'Product Collection', () => { 'woocommerce/woocommerce//archive-product' ); await expect( pageObject.products ).toHaveCount( 9 ); - await insertProductElements( { pageObject } ); + await insertProductElements( pageObject ); await editor.saveSiteEditorEntities(); await pageObject.goToProductCatalogFrontend(); - const firstProduct = pageObject.products.first(); + const product = pageObject.products.nth( 2 ); - verifyFirstProductContent( firstProduct ); + verifyProductContent( product ); } ); test( 'On a Home Page', async ( { pageObject, editor } ) => { await pageObject.goToHomePageAndInsertCollection(); await expect( pageObject.products ).toHaveCount( 9 ); - await insertProductElements( { pageObject } ); + await insertProductElements( pageObject ); await editor.saveSiteEditorEntities(); await pageObject.goToProductCatalogFrontend(); - const firstProduct = pageObject.products.first(); + const product = pageObject.products.nth( 2 ); - verifyFirstProductContent( firstProduct ); + verifyProductContent( product ); } ); } ); From 60c612797edd1118fc75418847d7efe68c0ab99e Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 16:04:00 +0100 Subject: [PATCH 09/22] Add comments to explain the expects --- .../product-collection.block_theme.spec.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 09ec29df1530..db1e0f85457c 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -48,7 +48,9 @@ test.describe( 'Product Collection', () => { } ); test.describe( 'Renders correctly with all Product Elements', async () => { - const insertProductElements = async ( { pageObject } ) => { + const insertProductElements = async ( + pageObject: ProductCollectionPage + ) => { // By default there are inner blocks: // - woocommerce/product-image // - core/post-title @@ -80,7 +82,16 @@ test.describe( 'Product Collection', () => { ); }; + const verifyProductContent = ( product: Locator ) => { + expect( product ).toContainText( 'Beanie' ); // core/post-title + expect( product ).toContainText( '$20.00 $15.00' ); // woocommerce/product-price + expect( product ).toContainText( 'SKU: WOO-BEANIE' ); // woocommerce/product-sku + expect( product ).toContainText( 'In stock' ); // woocommerce/product-stock-indicator + expect( product ).toContainText( 'This is a simple product.' ); // woocommerce/product-summary + expect( product ).toContainText( 'Accessories' ); // core/post-terms - product_cat + expect( product ).toContainText( 'Recommended' ); // core/post-terms - product_tag expect( product ).toContainText( 'SALE' ); // woocommerce/product-sale-badge + expect( product ).toContainText( 'Add to cart' ); // woocommerce/product-button }; test( 'In a post', async ( { pageObject } ) => { From e158eefd07b205a27a4ef1f8381c2bf3bae866e0 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 16:26:34 +0100 Subject: [PATCH 10/22] Adjust the expected content --- .../product-collection.block_theme.spec.ts | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index db1e0f85457c..5c5e93accb0a 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -84,13 +84,15 @@ test.describe( 'Product Collection', () => { const verifyProductContent = ( product: Locator ) => { expect( product ).toContainText( 'Beanie' ); // core/post-title - expect( product ).toContainText( '$20.00 $15.00' ); // woocommerce/product-price - expect( product ).toContainText( 'SKU: WOO-BEANIE' ); // woocommerce/product-sku + expect( product ).toContainText( + '$20.00 Original price was: $20.00.$18.00Current price is: $18.00.' + ); // woocommerce/product-price + expect( product ).toContainText( 'Woo-beanie' ); // woocommerce/product-sku expect( product ).toContainText( 'In stock' ); // woocommerce/product-stock-indicator expect( product ).toContainText( 'This is a simple product.' ); // woocommerce/product-summary expect( product ).toContainText( 'Accessories' ); // core/post-terms - product_cat expect( product ).toContainText( 'Recommended' ); // core/post-terms - product_tag - expect( product ).toContainText( 'SALE' ); // woocommerce/product-sale-badge + expect( product ).toContainText( 'SaleProduct on sale' ); // woocommerce/product-sale-badge expect( product ).toContainText( 'Add to cart' ); // woocommerce/product-button }; @@ -100,7 +102,7 @@ test.describe( 'Product Collection', () => { await insertProductElements( pageObject ); await pageObject.publishAndGoToFrontend(); - const product = pageObject.products.nth( 2 ); + const product = pageObject.products.nth( 1 ); verifyProductContent( product ); } ); @@ -117,7 +119,7 @@ test.describe( 'Product Collection', () => { await editor.saveSiteEditorEntities(); await pageObject.goToProductCatalogFrontend(); - const product = pageObject.products.nth( 2 ); + const product = pageObject.products.nth( 1 ); verifyProductContent( product ); } ); @@ -129,7 +131,7 @@ test.describe( 'Product Collection', () => { await editor.saveSiteEditorEntities(); await pageObject.goToProductCatalogFrontend(); - const product = pageObject.products.nth( 2 ); + const product = pageObject.products.nth( 1 ); verifyProductContent( product ); } ); From 4d4a713b787e333193c1c08ae85f36c243b2a702 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 16:44:39 +0100 Subject: [PATCH 11/22] Switch to lower case in expect --- .../product-collection/product-collection.block_theme.spec.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 5c5e93accb0a..d2eb80757d43 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -87,7 +87,7 @@ test.describe( 'Product Collection', () => { expect( product ).toContainText( '$20.00 Original price was: $20.00.$18.00Current price is: $18.00.' ); // woocommerce/product-price - expect( product ).toContainText( 'Woo-beanie' ); // woocommerce/product-sku + expect( product ).toContainText( 'woo-beanie' ); // woocommerce/product-sku expect( product ).toContainText( 'In stock' ); // woocommerce/product-stock-indicator expect( product ).toContainText( 'This is a simple product.' ); // woocommerce/product-summary expect( product ).toContainText( 'Accessories' ); // core/post-terms - product_cat @@ -114,7 +114,6 @@ test.describe( 'Product Collection', () => { await pageObject.replaceProductsWithProductCollectionInTemplate( 'woocommerce/woocommerce//archive-product' ); - await expect( pageObject.products ).toHaveCount( 9 ); await insertProductElements( pageObject ); await editor.saveSiteEditorEntities(); await pageObject.goToProductCatalogFrontend(); @@ -126,7 +125,6 @@ test.describe( 'Product Collection', () => { test( 'On a Home Page', async ( { pageObject, editor } ) => { await pageObject.goToHomePageAndInsertCollection(); - await expect( pageObject.products ).toHaveCount( 9 ); await insertProductElements( pageObject ); await editor.saveSiteEditorEntities(); await pageObject.goToProductCatalogFrontend(); From 7736a84c566625456e26365cb1c77c9e51f922bc Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 16:58:08 +0100 Subject: [PATCH 12/22] Switch from woocommerce/product-summary to core/post-excerpt --- .../product-collection.block_theme.spec.ts | 37 ++++++++++++------- 1 file changed, 23 insertions(+), 14 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index d2eb80757d43..aa0890308791 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -61,8 +61,14 @@ test.describe( 'Product Collection', () => { { name: 'woocommerce/product-rating', attributes: {} }, { name: 'woocommerce/product-sku', attributes: {} }, { name: 'woocommerce/product-stock-indicator', attributes: {} }, - { name: 'woocommerce/product-summary', attributes: {} }, { name: 'woocommerce/product-sale-badge', attributes: {} }, + { + name: 'core/post-excerpt', + attributes: { + __woocommerceNamespace: + 'woocommerce/product-collection/product-summary', + }, + }, { name: 'core/post-terms', attributes: { term: 'product_tag' }, @@ -82,18 +88,20 @@ test.describe( 'Product Collection', () => { ); }; - const verifyProductContent = ( product: Locator ) => { - expect( product ).toContainText( 'Beanie' ); // core/post-title - expect( product ).toContainText( + const verifyProductContent = async ( product: Locator ) => { + await expect( product ).toContainText( 'Beanie' ); // core/post-title + await expect( product ).toContainText( '$20.00 Original price was: $20.00.$18.00Current price is: $18.00.' ); // woocommerce/product-price - expect( product ).toContainText( 'woo-beanie' ); // woocommerce/product-sku - expect( product ).toContainText( 'In stock' ); // woocommerce/product-stock-indicator - expect( product ).toContainText( 'This is a simple product.' ); // woocommerce/product-summary - expect( product ).toContainText( 'Accessories' ); // core/post-terms - product_cat - expect( product ).toContainText( 'Recommended' ); // core/post-terms - product_tag - expect( product ).toContainText( 'SaleProduct on sale' ); // woocommerce/product-sale-badge - expect( product ).toContainText( 'Add to cart' ); // woocommerce/product-button + await expect( product ).toContainText( 'woo-beanie' ); // woocommerce/product-sku + await expect( product ).toContainText( 'In stock' ); // woocommerce/product-stock-indicator + await expect( product ).toContainText( + 'This is a simple product.' + ); // core/post-excerpt + await expect( product ).toContainText( 'Accessories' ); // core/post-terms - product_cat + await expect( product ).toContainText( 'Recommended' ); // core/post-terms - product_tag + await expect( product ).toContainText( 'SaleProduct on sale' ); // woocommerce/product-sale-badge + await expect( product ).toContainText( 'Add to cart' ); // woocommerce/product-button }; test( 'In a post', async ( { pageObject } ) => { @@ -104,7 +112,7 @@ test.describe( 'Product Collection', () => { const product = pageObject.products.nth( 1 ); - verifyProductContent( product ); + await verifyProductContent( product ); } ); test( 'In a Product Archive (Product Catalog)', async ( { @@ -120,18 +128,19 @@ test.describe( 'Product Collection', () => { const product = pageObject.products.nth( 1 ); - verifyProductContent( product ); + await verifyProductContent( product ); } ); test( 'On a Home Page', async ( { pageObject, editor } ) => { await pageObject.goToHomePageAndInsertCollection(); + await insertProductElements( pageObject ); await editor.saveSiteEditorEntities(); await pageObject.goToProductCatalogFrontend(); const product = pageObject.products.nth( 1 ); - verifyProductContent( product ); + await verifyProductContent( product ); } ); } ); From 4e14f92f0ef2469b852656eaba464ca4a968b79e Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 17:15:22 +0100 Subject: [PATCH 13/22] Adjust products.sh --- plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh b/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh index a0f9894fb471..5c616153d02e 100644 --- a/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh +++ b/plugins/woocommerce-blocks/tests/e2e/bin/scripts/products.sh @@ -22,13 +22,13 @@ image3=$(wp post list --post_type=attachment --field=ID --name="hoodie-2.jpg" -- wp post meta update $hoodie_product_id _product_image_gallery "$image1,$image2,$image3" # Create a tag, so we can add tests for tag-related blocks and templates. +beanie_product_id=$(wp post list --post_type=product --field=ID --name="Beanie" --format=ids) tag_id=$(wp wc product_tag create --name="Recommended" --slug="recommended" --description="Curated products selected by our experts" --porcelain --user=1) wp wc product update $hoodie_product_id --tags="[ { \"id\": $tag_id } ]" --user=1 wp wc product update $beanie_product_id --tags="[ { \"id\": $tag_id } ]" --user=1 # This is a non-hacky work around to set up the cross sells product. cap_product_id=$(wp post list --post_type=product --field=ID --name="Cap" --format=ids) -beanie_product_id=$(wp post list --post_type=product --field=ID --name="Beanie" --format=ids) wp post meta update $beanie_product_id _crosssell_ids "$cap_product_id" # Set a product out of stock From 5bbd445aa6a68caeab75ffd4f53f1b1b9b091149 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 17:50:50 +0100 Subject: [PATCH 14/22] Improve method waiting for products to show so it;'s deterministic --- .../product-collection/product-collection.page.ts | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts index d26c9f2919c8..274d2a588783 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts @@ -660,10 +660,17 @@ class ProductCollectionPage { } private async waitForProductsToLoad() { - // Wait for the product blocks to be loaded. - await this.page.waitForSelector( 'wc-block-product-template__spinner', { - state: 'detached', - } ); + const loaderInTemplate = this.page + .frameLocator( 'iframe[name="editor-canvas"]' ) + .getByLabel( 'Block: Product Template' ) + .locator( 'circle' ); + const loaderInPost = this.page + .getByLabel( 'Block: Product Template' ) + .locator( 'circle' ); + await Promise.all( [ + loaderInTemplate.waitFor( { state: 'hidden', timeout: 100000 } ), + loaderInPost.waitFor( { state: 'hidden', timeout: 100000 } ), + ] ); } } From d007a3582ea72dcda489cfb90a14892efa7f8ef0 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 17:51:14 +0100 Subject: [PATCH 15/22] Refresh locators in template --- .../e2e/tests/product-collection/product-collection.page.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts index 274d2a588783..3a96046ab3c1 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts @@ -190,6 +190,7 @@ class ProductCollectionPage { this.BLOCK_SLUG ); await this.chooseCollectionInTemplate( collection ); + await this.refreshLocators( 'editor' ); await this.editor.saveSiteEditorEntities(); } From 017b0aa6e6017c8519f5567ca9b327f961c768bf Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Fri, 15 Mar 2024 17:51:36 +0100 Subject: [PATCH 16/22] Remove unnecessary check --- .../product-collection/product-collection.block_theme.spec.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index aa0890308791..58f50f78b6bc 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -106,7 +106,6 @@ test.describe( 'Product Collection', () => { test( 'In a post', async ( { pageObject } ) => { await pageObject.createNewPostAndInsertBlock(); - await expect( pageObject.products ).toHaveCount( 9 ); await insertProductElements( pageObject ); await pageObject.publishAndGoToFrontend(); From 1afae8b74014392b3cbe86ed16dc597ad00e570c Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Mon, 18 Mar 2024 12:01:21 +0100 Subject: [PATCH 17/22] Eslint disable: expects are extracted to function so disable eslint compaining there's no expect --- .../product-collection.block_theme.spec.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 58f50f78b6bc..a181502866ee 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -104,6 +104,8 @@ test.describe( 'Product Collection', () => { await expect( product ).toContainText( 'Add to cart' ); // woocommerce/product-button }; + // Expects are collected in verifyProductContent function + // eslint-disable-next-line playwright/expect-expect test( 'In a post', async ( { pageObject } ) => { await pageObject.createNewPostAndInsertBlock(); await insertProductElements( pageObject ); @@ -114,6 +116,8 @@ test.describe( 'Product Collection', () => { await verifyProductContent( product ); } ); + // Expects are collected in verifyProductContent function + // eslint-disable-next-line playwright/expect-expect test( 'In a Product Archive (Product Catalog)', async ( { pageObject, editor, @@ -130,6 +134,8 @@ test.describe( 'Product Collection', () => { await verifyProductContent( product ); } ); + // Expects are collected in verifyProductContent function + // eslint-disable-next-line playwright/expect-expect test( 'On a Home Page', async ( { pageObject, editor } ) => { await pageObject.goToHomePageAndInsertCollection(); From ba9342967b9030e7831859ed5c64566b826b9058 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Mon, 18 Mar 2024 12:01:37 +0100 Subject: [PATCH 18/22] Adjust other test after amending products setup --- .../product-collection/product-collection.block_theme.spec.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index a181502866ee..b20b3ea8e88e 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -302,10 +302,10 @@ test.describe( 'Product Collection', () => { await pageObject.setFilterComboboxValue( filterName, [ 'Recommended', ] ); - await expect( pageObject.productTitles ).toHaveText( [ 'Hoodie' ] ); + await expect( pageObject.productTitles ).toHaveText( [ 'Beanie' ] ); await pageObject.publishAndGoToFrontend(); - await expect( pageObject.productTitles ).toHaveText( [ 'Hoodie' ] ); + await expect( pageObject.productTitles ).toHaveText( [ 'Beanie' ] ); } ); test( 'Products can be filtered based on product attributes like color, size etc.', async ( { From 2462eeff721c7b08045cd15935760561fcbe4e6f Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Mon, 18 Mar 2024 12:29:55 +0100 Subject: [PATCH 19/22] Change the verify happening in a wrong place --- .../product-collection/product-collection.block_theme.spec.ts | 2 +- .../e2e/tests/product-collection/product-collection.page.ts | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index b20b3ea8e88e..86f041b68da7 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -141,7 +141,7 @@ test.describe( 'Product Collection', () => { await insertProductElements( pageObject ); await editor.saveSiteEditorEntities(); - await pageObject.goToProductCatalogFrontend(); + await pageObject.goToHomePageFrontend(); const product = pageObject.products.nth( 1 ); diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts index 3a96046ab3c1..5ff6294265b0 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts @@ -198,6 +198,10 @@ class ProductCollectionPage { await this.page.goto( `/shop` ); } + async goToHomePageFrontend() { + await this.page.goto( `/` ); + } + async insertProductCollection() { await this.editor.insertBlock( { name: this.BLOCK_SLUG } ); } From cb2af67fc3387373bf9640c48083806899a0030f Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Mon, 18 Mar 2024 13:02:48 +0100 Subject: [PATCH 20/22] Tests adjustments --- .../product-collection.block_theme.spec.ts | 10 ++++++++-- .../product-collection/product-collection.page.ts | 2 ++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 86f041b68da7..0c734f9d98f9 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -302,10 +302,16 @@ test.describe( 'Product Collection', () => { await pageObject.setFilterComboboxValue( filterName, [ 'Recommended', ] ); - await expect( pageObject.productTitles ).toHaveText( [ 'Beanie' ] ); + await expect( pageObject.productTitles ).toHaveText( [ + 'Beanie', + 'Hoodie', + ] ); await pageObject.publishAndGoToFrontend(); - await expect( pageObject.productTitles ).toHaveText( [ 'Beanie' ] ); + await expect( pageObject.productTitles ).toHaveText( [ + 'Beanie', + 'Hoodie', + ] ); } ); test( 'Products can be filtered based on product attributes like color, size etc.', async ( { diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts index 5ff6294265b0..1fae6856a8c1 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts @@ -196,10 +196,12 @@ class ProductCollectionPage { async goToProductCatalogFrontend() { await this.page.goto( `/shop` ); + await this.refreshLocators( 'frontend' ); } async goToHomePageFrontend() { await this.page.goto( `/` ); + await this.refreshLocators( 'frontend' ); } async insertProductCollection() { From fc2c6fe96e2df0b260c7d1820a169e35df923b03 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Mon, 18 Mar 2024 14:42:15 +0100 Subject: [PATCH 21/22] Revert Blog Home template before performing a test --- .../product-collection/product-collection.page.ts | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts index 1fae6856a8c1..6128be395fa5 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.page.ts @@ -209,18 +209,19 @@ class ProductCollectionPage { } async goToTemplateAndInsertCollection( - postId: string, + template: string, collection?: Collections ) { + await this.templateApiUtils.revertTemplate( template ); await this.admin.visitSiteEditor( { - postId, + postId: template, postType: 'wp_template', } ); await this.editorUtils.waitForSiteEditorFinishLoading(); await this.editor.canvas.click( 'body' ); await this.insertProductCollection(); await this.chooseCollectionInTemplate( collection ); - await this.editor.openDocumentSettingsSidebar(); + await this.refreshLocators( 'editor' ); await this.editor.saveSiteEditorEntities(); } @@ -232,10 +233,6 @@ class ProductCollectionPage { } async goToProductCatalogAndInsertCollection( collection?: Collections ) { - await this.templateApiUtils.revertTemplate( - 'woocommerce/woocommerce//archive-product' - ); - await this.goToTemplateAndInsertCollection( 'woocommerce/woocommerce//archive-product', collection From 778666d3118244dd0486284239af5dbc2c6e0b41 Mon Sep 17 00:00:00 2001 From: Karol Manijak <20098064+kmanijak@users.noreply.github.com> Date: Mon, 18 Mar 2024 15:23:21 +0100 Subject: [PATCH 22/22] Fix other tests --- .../product-collection.block_theme.spec.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts index 0c734f9d98f9..3af42dc068fb 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/product-collection/product-collection.block_theme.spec.ts @@ -441,8 +441,10 @@ test.describe( 'Product Collection', () => { test( 'should work as expected in Product Catalog template', async ( { pageObject, + editor, } ) => { await pageObject.goToProductCatalogAndInsertCollection(); + await editor.openDocumentSettingsSidebar(); const sidebarSettings = await pageObject.locateSidebarSettings(); @@ -493,10 +495,12 @@ test.describe( 'Product Collection', () => { test( 'is enabled by default in 1st Product Collection and disabled in 2nd+', async ( { pageObject, + editor, } ) => { // First Product Catalog // Option should be visible & ENABLED by default await pageObject.goToProductCatalogAndInsertCollection(); + await editor.openDocumentSettingsSidebar(); const sidebarSettings = await pageObject.locateSidebarSettings(); @@ -746,7 +750,7 @@ test.describe( 'Product Collection', () => { await expect( pageObject.products ).toHaveCount( 4 ); } ); - test( "Product Catalog Collection can be added in post and doesn't inherit query from template", async ( { + test( "Product Catalog Collection can be added in post and doesn't sync query with template", async ( { pageObject, } ) => { await pageObject.createNewPostAndInsertBlock( 'productCatalog' ); @@ -764,12 +768,14 @@ test.describe( 'Product Collection', () => { await expect( pageObject.products ).toHaveCount( 9 ); } ); - test( 'Product Catalog Collection can be added in product archive and inherits query from template', async ( { + test( 'Product Catalog Collection can be added in product archive and syncs query with template', async ( { pageObject, + editor, } ) => { await pageObject.goToProductCatalogAndInsertCollection( 'productCatalog' ); + await editor.openDocumentSettingsSidebar(); const sidebarSettings = await pageObject.locateSidebarSettings(); const input = sidebarSettings.locator(