Commit d026d729fdc for woocommerce
commit d026d729fdc281017ba0249b608e662638e8c935
Author: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
Date: Fri Jul 17 11:21:39 2026 +0200
Fix Blocks E2E tests with WordPress 7.1 beta 1 (#66711)
* Fix Site Editor content locators for WordPress 7.1
* Add changelog for WordPress 7.1 E2E locator fix
* Fix remaining WordPress 7.1 block test failures
* Fix Product Collection editor E2E interactions
* Fix Product Collection template picker locator
diff --git a/plugins/woocommerce/changelog/dev-wp-7-1-e2e-content-locators b/plugins/woocommerce/changelog/dev-wp-7-1-e2e-content-locators
new file mode 100644
index 00000000000..962ba5cfd61
--- /dev/null
+++ b/plugins/woocommerce/changelog/dev-wp-7-1-e2e-content-locators
@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Update Blocks E2E Site Editor content locators for WordPress 7.1.
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts
index 8389c139325..9a585736473 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts
@@ -170,7 +170,6 @@ test.describe( `${ blockData.name } Block`, () => {
editor,
requestUtils,
blockUtils,
- wpCoreVersion,
} ) => {
// Add to Cart with Options in the Site Editor is only available as
// inner block of the Single Product Block except for the Single Product
@@ -187,16 +186,9 @@ test.describe( `${ blockData.name } Block`, () => {
canvas: 'edit',
} );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
-
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
await editor.insertBlock( { name: 'woocommerce/single-product' } );
@@ -218,7 +210,6 @@ test.describe( `${ blockData.name } Block`, () => {
admin,
editor,
requestUtils,
- wpCoreVersion,
} ) => {
const template = await requestUtils.createTemplate( 'wp_template', {
slug: 'single-product',
@@ -232,16 +223,9 @@ test.describe( `${ blockData.name } Block`, () => {
canvas: 'edit',
} );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
-
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
await editor.insertBlock( { name: blockData.slug } );
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/breadcrumbs/breadcrumbs.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/breadcrumbs/breadcrumbs.block_theme.spec.ts
index 628b14c7d7a..50740c66e52 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/breadcrumbs/breadcrumbs.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/breadcrumbs/breadcrumbs.block_theme.spec.ts
@@ -30,7 +30,6 @@ test.describe( `${ blockData.slug } Block`, () => {
admin,
requestUtils,
editor,
- wpCoreVersion,
} ) => {
const template = await requestUtils.createTemplate( 'wp_template', {
slug: 'sorter',
@@ -44,16 +43,9 @@ test.describe( `${ blockData.slug } Block`, () => {
canvas: 'edit',
} );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
-
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
await editor.insertBlock( {
name: blockData.slug,
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/catalog-sorting/catalog-sorting.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/catalog-sorting/catalog-sorting.block_theme.spec.ts
index 3727e0591f6..b0e9dec3811 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/catalog-sorting/catalog-sorting.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/catalog-sorting/catalog-sorting.block_theme.spec.ts
@@ -31,7 +31,6 @@ test.describe( `${ blockData.slug } Block`, () => {
admin,
requestUtils,
editor,
- wpCoreVersion,
} ) => {
const template = await requestUtils.createTemplate( 'wp_template', {
slug: 'sorter',
@@ -45,15 +44,9 @@ test.describe( `${ blockData.slug } Block`, () => {
canvas: 'edit',
} );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
await editor.insertBlock( {
name: blockData.slug,
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/extensibility-events.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/extensibility-events.block_theme.spec.ts
index 8661492c385..b08b2f8ba11 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/extensibility-events.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/extensibility-events.block_theme.spec.ts
@@ -88,16 +88,22 @@ test.describe( 'Product Collection: Extensibility Events', () => {
test.beforeEach( async ( { page, pageObject } ) => {
await pageObject.createNewPostAndInsertBlock( 'featured' );
+ let resolvePayload!: ( payload: {
+ productId?: number;
+ collection?: string;
+ } ) => void;
promise = new Promise( ( resolve ) => {
- void page.exposeFunction( 'resolvePayload', resolve );
- void page.addInitScript( () => {
- window.document.addEventListener(
- 'wc-blocks_viewed_product',
- ( e ) => {
- window.resolvePayload( e.detail );
- }
- );
- } );
+ resolvePayload = resolve;
+ } );
+
+ await page.exposeFunction( 'resolvePayload', resolvePayload );
+ await page.addInitScript( () => {
+ window.document.addEventListener(
+ 'wc-blocks_viewed_product',
+ ( e ) => {
+ window.resolvePayload( e.detail );
+ }
+ );
} );
await pageObject.publishAndGoToFrontend();
@@ -117,7 +123,11 @@ test.describe( 'Product Collection: Extensibility Events', () => {
} );
test( 'when Product Title is clicked', async ( { page } ) => {
- await page.locator( '.wp-block-post-title' ).nth( 0 ).click();
+ await page
+ .locator( '.wp-block-post-title' )
+ .first()
+ .getByRole( 'link' )
+ .click();
const { collection, productId } = await promise;
expect( collection ).toEqual(
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/inspector-controls.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/inspector-controls.block_theme.spec.ts
index b661fd9e14e..cab223ec258 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/inspector-controls.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/inspector-controls.block_theme.spec.ts
@@ -578,13 +578,14 @@ test.describe( 'Product Collection: Inspector Controls', () => {
// Disable the option in the first Product Catalog
await editor.selectBlocks( productCollection.first() );
+ await expect( defaultQueryType ).toBeChecked();
await customQueryType.click();
+ await expect( customQueryType ).toBeChecked();
// Third Product Catalog
// Option should be visible & ENABLED by default
await pageObject.insertProductCollection();
await pageObject.chooseCollectionInTemplate( 'productCatalog' );
- await editor.selectBlocks( productCollection.last() );
await expect( defaultQueryType ).toBeChecked();
await expect( customQueryType ).not.toBeChecked();
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.block_theme.spec.ts
index ce6b19faf9b..83d73aee78f 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.block_theme.spec.ts
@@ -788,7 +788,6 @@ test.describe( 'Product Collection', () => {
admin,
editor,
page,
- wpCoreVersion,
} ) => {
await pageObject.refreshLocators( 'frontend' );
@@ -812,15 +811,9 @@ test.describe( 'Product Collection', () => {
canvas: 'edit',
} );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
await editor.insertBlock( { name: legacyBlockName } );
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.page.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.page.ts
index d61bfe9588f..1d4c3b1c79c 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.page.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/product-collection.page.ts
@@ -185,15 +185,17 @@ class ProductCollectionPage {
] );
}
- async chooseCollectionInTemplate( collection?: Collections ) {
+ async locateCollectionButtonInEditor( collection?: Collections ) {
await this.editor.closeGlobalBlockInserter();
const buttonName = collection
? collectionToButtonNameMap[ collection ]
: collectionToButtonNameMap.productCatalog;
- const inserterClass = await this.editor.canvas
- .locator( SELECTORS.collectionPlaceholder )
+ const placeholderSelector = this.editor.canvas.locator(
+ SELECTORS.collectionPlaceholder
+ );
+ const inserterClass = await placeholderSelector
.locator(
'.wc-blocks-product-collection__collections-grid, .wc-blocks-product-collection__collections-dropdown'
)
@@ -204,22 +206,32 @@ class ProductCollectionPage {
);
if ( isDropdown ) {
- await this.editor.canvas
+ await placeholderSelector
.getByRole( 'button', { name: 'Choose collection' } )
.click();
- await this.editor.canvas
+ return this.admin.page
.locator(
'.wc-blocks-product-collection__collections-dropdown-content'
)
- .getByRole( 'button', { name: buttonName, exact: true } )
- .click();
- } else {
- await this.editor.canvas
- .locator( SELECTORS.collectionPlaceholder )
- .getByRole( 'button', { name: buttonName, exact: true } )
- .click();
+ .getByRole( 'button', {
+ name: buttonName,
+ exact: true,
+ } );
}
+
+ return placeholderSelector.getByRole( 'button', {
+ name: buttonName,
+ exact: true,
+ } );
+ }
+
+ async chooseCollectionInTemplate( collection?: Collections ) {
+ const collectionButton = await this.locateCollectionButtonInEditor(
+ collection
+ );
+
+ await collectionButton.click();
}
async chooseProductInEditorProductPickerIfAvailable(
@@ -374,7 +386,7 @@ class ProductCollectionPage {
}
async insertProductCollection() {
- await this.editor.insertBlock( { name: this.BLOCK_SLUG } );
+ await this.editor.insertBlockUsingGlobalInserter( this.BLOCK_NAME );
}
async goToTemplateAndInsertCollection(
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/register-product-collection.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/register-product-collection.block_theme.spec.ts
index ac8e8ef76d8..a24f6ee27fc 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/register-product-collection.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-collection/register-product-collection.block_theme.spec.ts
@@ -642,40 +642,30 @@ test.describe( 'Product Collection: Register Product Collection', () => {
test.describe( 'with "scope" argument', () => {
test( 'Collection with only `inserter` scope should not be displayed in Collection Chooser', async ( {
pageObject,
- editor,
admin,
} ) => {
await admin.createNewPost();
await pageObject.insertProductCollection();
- const placeholderSelector = editor.canvas.locator(
- SELECTORS.collectionPlaceholder
- );
-
- const collectionButton = placeholderSelector.getByRole( 'button', {
- name: 'My Custom Collection - With Inserter Scope',
- exact: true,
- } );
+ const collectionButton =
+ await pageObject.locateCollectionButtonInEditor(
+ 'myCustomCollectionWithInserterScope'
+ );
await expect( collectionButton ).toBeHidden();
} );
test( 'Collection with only `block` scope should be displayed in Collection Chooser', async ( {
pageObject,
- editor,
admin,
} ) => {
await admin.createNewPost();
await pageObject.insertProductCollection();
- const placeholderSelector = editor.canvas.locator(
- SELECTORS.collectionPlaceholder
- );
-
- const collectionButton = placeholderSelector.getByRole( 'button', {
- name: 'My Custom Collection - With Block Scope',
- exact: true,
- } );
+ const collectionButton =
+ await pageObject.locateCollectionButtonInEditor(
+ 'myCustomCollectionWithBlockScope'
+ );
await expect( collectionButton ).toBeVisible();
} );
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-filters/attribute-filter-editor.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-filters/attribute-filter-editor.block_theme.spec.ts
index a7373353259..af8b3741f16 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-filters/attribute-filter-editor.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-filters/attribute-filter-editor.block_theme.spec.ts
@@ -19,6 +19,11 @@ const blockData = {
slug: 'archive-product',
};
+const getExpectedStyleControls = ( wpCoreVersion: number ) =>
+ wpCoreVersion >= 7.1
+ ? [ 'Typography', 'Dimensions', 'Border' ]
+ : [ 'Color', 'Typography', 'Dimensions' ];
+
const test = base.extend< { pageObject: ProductFiltersPage } >( {
pageObject: async ( { page, editor, frontendUtils }, use ) => {
const pageObject = new ProductFiltersPage( {
@@ -42,6 +47,7 @@ test.describe( `${ blockData.name }`, () => {
test( 'should display the correct inspector style controls', async ( {
editor,
pageObject,
+ wpCoreVersion,
} ) => {
await pageObject.addProductFiltersBlock( { cleanContent: true } );
@@ -53,18 +59,13 @@ test.describe( `${ blockData.name }`, () => {
await editor.openDocumentSettingsSidebar();
await editor.page.getByRole( 'tab', { name: 'Styles' } ).click();
- await expect(
- editor.page.getByText( 'ColorAll options are currently hidden' )
- ).toBeVisible();
- await expect(
- editor.page.getByText(
- 'TypographyAll options are currently hidden'
- )
- ).toBeVisible();
- await expect(
- editor.page.getByText(
- 'DimensionsAll options are currently hidden'
- )
- ).toBeVisible();
+ for ( const control of getExpectedStyleControls( wpCoreVersion ) ) {
+ await expect(
+ editor.page.getByRole( 'heading', {
+ name: control,
+ exact: true,
+ } )
+ ).toBeVisible();
+ }
} );
} );
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/inner-blocks/product-gallery-thumbnails/product-gallery-thumbnails.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/inner-blocks/product-gallery-thumbnails/product-gallery-thumbnails.block_theme.spec.ts
index 0b8305721a7..144d93d0e71 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/inner-blocks/product-gallery-thumbnails/product-gallery-thumbnails.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/inner-blocks/product-gallery-thumbnails/product-gallery-thumbnails.block_theme.spec.ts
@@ -4,40 +4,31 @@
import { test, expect } from '@woocommerce/e2e-utils';
test.describe( 'Product Gallery Thumbnails block', () => {
- test.beforeEach(
- async ( { admin, editor, requestUtils, wpCoreVersion } ) => {
- const template = await requestUtils.createTemplate( 'wp_template', {
- slug: 'single-product',
- title: 'Custom Single Product',
- content: 'placeholder',
- } );
-
- await admin.visitSiteEditor( {
- postId: template.id,
- postType: 'wp_template',
- canvas: 'edit',
- } );
+ test.beforeEach( async ( { admin, editor, requestUtils } ) => {
+ const template = await requestUtils.createTemplate( 'wp_template', {
+ slug: 'single-product',
+ title: 'Custom Single Product',
+ content: 'placeholder',
+ } );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
+ await admin.visitSiteEditor( {
+ postId: template.id,
+ postType: 'wp_template',
+ canvas: 'edit',
+ } );
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
- await editor.insertBlock( {
- name: 'woocommerce/product-gallery',
- } );
+ await editor.insertBlock( {
+ name: 'woocommerce/product-gallery',
+ } );
- await editor.saveSiteEditorEntities( {
- isOnlyCurrentEntityDirty: true,
- } );
- }
- );
+ await editor.saveSiteEditorEntities( {
+ isOnlyCurrentEntityDirty: true,
+ } );
+ } );
test( 'renders as expected', async ( { page, editor } ) => {
await test.step( 'in editor', async () => {
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/product-gallery.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/product-gallery.block_theme.spec.ts
index 75bcc4e2851..a9de7c1fa04 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/product-gallery.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-gallery/product-gallery.block_theme.spec.ts
@@ -67,32 +67,23 @@ const getThumbnailImageIdByNth = async (
};
test.describe( `${ blockData.name }`, () => {
- test.beforeEach(
- async ( { admin, editor, requestUtils, wpCoreVersion } ) => {
- const template = await requestUtils.createTemplate( 'wp_template', {
- slug: blockData.slug,
- title: 'Custom Single Product',
- content: 'placeholder',
- } );
+ test.beforeEach( async ( { admin, editor, requestUtils } ) => {
+ const template = await requestUtils.createTemplate( 'wp_template', {
+ slug: blockData.slug,
+ title: 'Custom Single Product',
+ content: 'placeholder',
+ } );
- await admin.visitSiteEditor( {
- postId: template.id,
- postType: 'wp_template',
- canvas: 'edit',
- } );
+ await admin.visitSiteEditor( {
+ postId: template.id,
+ postType: 'wp_template',
+ canvas: 'edit',
+ } );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
-
- await expect( placeholderLocator ).toBeVisible();
- }
- );
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
+ } );
test.describe( 'with thumbnails', () => {
test( 'should have as first thumbnail, the same image that it is visible in the product block', async ( {
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/product-results-count/product-results-count.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/product-results-count/product-results-count.block_theme.spec.ts
index 888e5e48039..28b9af2fb79 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/product-results-count/product-results-count.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/product-results-count/product-results-count.block_theme.spec.ts
@@ -31,7 +31,6 @@ test.describe( `${ blockData.slug } Block`, () => {
admin,
requestUtils,
editor,
- wpCoreVersion,
} ) => {
const template = await requestUtils.createTemplate( 'wp_template', {
slug: 'sorter',
@@ -45,15 +44,9 @@ test.describe( `${ blockData.slug } Block`, () => {
canvas: 'edit',
} );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
await editor.insertBlock( {
name: blockData.slug,
} );
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/products/products.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/products/products.block_theme.spec.ts
index 6c4427a6f9a..b039c7cc8b8 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/products/products.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/products/products.block_theme.spec.ts
@@ -131,6 +131,9 @@ test.describe( `${ blockData.name } Block `, () => {
page,
} ) => {
await admin.createNewPost();
+ await expect(
+ editor.canvas.getByLabel( /Add default block|Empty block/ )
+ ).toBeVisible();
await insertProductsQuery( editor, { inherit: false } );
await editor.publishAndVisitPost();
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/products/utils.ts b/plugins/woocommerce/tests/e2e/tests/blocks/products/utils.ts
index dec142f1903..69ab43000da 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/products/utils.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/products/utils.ts
@@ -50,6 +50,7 @@ export const insertProductsQuery = async (
namespace: 'woocommerce/product-query',
query: {
inherit: options.inherit ?? true,
+ postType: 'product',
},
},
innerBlocks: productQueryInnerBlocksTemplate,
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/single-product-details/single-product-details.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/single-product-details/single-product-details.block_theme.spec.ts
index 2a87972c1c6..f0f653d437c 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/single-product-details/single-product-details.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/single-product-details/single-product-details.block_theme.spec.ts
@@ -34,7 +34,6 @@ test.describe( `${ blockData.slug } Block`, () => {
admin,
requestUtils,
editor,
- wpCoreVersion,
} ) => {
const template = await requestUtils.createTemplate( 'wp_template', {
// Single Product Details block is addable only in Single Product Templates
@@ -49,15 +48,9 @@ test.describe( `${ blockData.slug } Block`, () => {
canvas: 'edit',
} );
- // TODO: WP 7.0 compat - Custom HTML block content is inside an iframe
- // since WP 7.0. Simplify when WP 7.0 is the minimum supported version.
- const placeholderLocator =
- wpCoreVersion >= 7
- ? editor.canvas
- .frameLocator( 'iframe' )
- .getByText( 'placeholder' )
- : editor.canvas.getByText( 'placeholder' );
- await expect( placeholderLocator ).toBeVisible();
+ await expect(
+ editor.getCustomHtmlBlockContentLocator( 'placeholder' )
+ ).toBeVisible();
await editor.insertBlock( {
name: blockData.slug,
diff --git a/plugins/woocommerce/tests/e2e/utils/blocks/editor/editor-utils.page.ts b/plugins/woocommerce/tests/e2e/utils/blocks/editor/editor-utils.page.ts
index 3daac0c4d0f..573f427ee03 100644
--- a/plugins/woocommerce/tests/e2e/utils/blocks/editor/editor-utils.page.ts
+++ b/plugins/woocommerce/tests/e2e/utils/blocks/editor/editor-utils.page.ts
@@ -20,6 +20,17 @@ export class Editor extends CoreEditor {
this.wpCoreVersion = wpCoreVersion;
}
+ /**
+ * Returns a locator for Custom HTML block content in the Site Editor canvas.
+ * WordPress 7.0 renders the content inside an additional iframe.
+ * WordPress 6.9 and 7.1+ render it directly in the editor canvas.
+ */
+ getCustomHtmlBlockContentLocator( content: string ) {
+ return this.wpCoreVersion === 7
+ ? this.canvas.frameLocator( 'iframe' ).getByText( content )
+ : this.canvas.getByText( content );
+ }
+
async getBlockByName( name: string ) {
const blockSelector = `[data-type="${ name }"]`;
const canvasLocator = this.page