Commit f3bd1c44f77 for woocommerce
commit f3bd1c44f77a5ee58d8f7c9a31054c3122f87103
Author: Seun Olorunsola <30554163+triple0t@users.noreply.github.com>
Date: Mon Jul 20 09:24:03 2026 +0200
[Email Editor] Fix preview-in-new-tab guard and telemetry on WP 7.1 (#66736)
* Fix email editor preview-in-new-tab guard and telemetry on WP 7.1
WP 7.1 dropped the .editor-preview-dropdown__button-external class, which the unsaved-changes preview guard and the click telemetry both matched on. Both silently stopped working. Match the new menu item anchor (a[role="menuitem"][target^="wp-preview-"]) alongside the old class so they keep working across supported WordPress versions.
* Fix email editor e2e tests on WP 7.1
Update the tracking-selectors canary to the new preview menu item (keeping the old class for WP 6.9/7.0), and use a single-line block edit in 'Can edit and save content' — on WP 7.1 a newline in the fill leaves the post undirtied so Save never enables.
diff --git a/packages/js/email-editor/changelog/fix-preview-in-new-tab-selector-wp-7-1 b/packages/js/email-editor/changelog/fix-preview-in-new-tab-selector-wp-7-1
new file mode 100644
index 00000000000..958d35b15b7
--- /dev/null
+++ b/packages/js/email-editor/changelog/fix-preview-in-new-tab-selector-wp-7-1
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Restore the "Preview in new tab" unsaved-changes guard and its telemetry event on WordPress 7.1, which dropped the editor-preview-dropdown__button-external class the code matched on.
diff --git a/packages/js/email-editor/src/components/preview/preview-save-guard.ts b/packages/js/email-editor/src/components/preview/preview-save-guard.ts
index 9af938f1a7a..89e021f2362 100644
--- a/packages/js/email-editor/src/components/preview/preview-save-guard.ts
+++ b/packages/js/email-editor/src/components/preview/preview-save-guard.ts
@@ -12,7 +12,12 @@ import { store as noticesStore } from '@wordpress/notices';
* when a user tries to open a preview in a new tab.
*/
export const PreviewSaveGuard = () => {
- const selector = '.editor-preview-dropdown__button-external';
+ // WP 7.1 dropped the `.editor-preview-dropdown__button-external` class. The
+ // "Preview in new tab" entry is now a plain menu item anchor whose window
+ // target is `wp-preview-<postId>`. Match both so the guard keeps catching
+ // the preview action across supported WordPress versions.
+ const selector =
+ '.editor-preview-dropdown__button-external, a[role="menuitem"][target^="wp-preview-"]';
/**
* Handles click/keydown events to check for unsaved changes before previewing.
diff --git a/packages/js/email-editor/src/events/dom-tracking.ts b/packages/js/email-editor/src/events/dom-tracking.ts
index da7d3af200c..a1884e7c3f8 100644
--- a/packages/js/email-editor/src/events/dom-tracking.ts
+++ b/packages/js/email-editor/src/events/dom-tracking.ts
@@ -49,7 +49,12 @@ export function initDomTracking() {
// Header preview dropdown preview in new tab selected
{
track: 'header_preview_dropdown_preview_in_new_tab_selected',
- selector: '.editor-preview-dropdown__button-external',
+ // WP 7.1 dropped the `.editor-preview-dropdown__button-external`
+ // class; the entry is now a menu item anchor whose window target is
+ // `wp-preview-<postId>`. Match both so the event keeps firing across
+ // supported WordPress versions.
+ selector:
+ '.editor-preview-dropdown__button-external, a[role="menuitem"][target^="wp-preview-"]',
},
// Header toggle block tools
{
diff --git a/plugins/woocommerce/changelog/fix-email-editor-e2e-wp-7-1 b/plugins/woocommerce/changelog/fix-email-editor-e2e-wp-7-1
new file mode 100644
index 00000000000..c04c877834f
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-email-editor-e2e-wp-7-1
@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Fix email editor E2E tests on WordPress 7.1: update the preview "open in new tab" tracking selector to the new menu item and use a single-line block edit so the Save button enables.
diff --git a/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-loads.spec.ts b/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-loads.spec.ts
index 101c8babd33..9c3cccac522 100644
--- a/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-loads.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-loads.spec.ts
@@ -104,13 +104,16 @@ test.describe( 'WooCommerce Email Editor Core', () => {
.getByText( 'You’ve received a new' )
).toBeVisible();
+ // Note: fill with a single line of text. On WP 7.1 a value containing a
+ // newline splits the paragraph but the edit never registers as a
+ // dirtying change, so the Save button stays disabled. A single-line
+ // edit commits normally and still exercises the edit → save → preview
+ // flow this test covers.
await page
.locator( 'iframe[name="editor-canvas"]' )
.contentFrame()
.getByText( 'You’ve received a new' )
- .fill(
- 'Hello world from Woo plugin\nYou’ve received a new order from [woocommerce/customer-full-name]'
- );
+ .fill( 'Hello world from Woo plugin' );
await expect(
page.getByRole( 'button', { name: 'Save', exact: true } )
).toBeVisible();
diff --git a/plugins/woocommerce/tests/e2e/tests/email/editor-tracking-selectors.spec.ts b/plugins/woocommerce/tests/e2e/tests/email/editor-tracking-selectors.spec.ts
index aa095feb5e5..d8670686d3c 100644
--- a/plugins/woocommerce/tests/e2e/tests/email/editor-tracking-selectors.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/email/editor-tracking-selectors.spec.ts
@@ -104,9 +104,18 @@ test.describe( 'WooCommerce Email Editor Tracking Selectors', () => {
await editorLocator
.locator( '.editor-preview-dropdown__toggle' )
.click();
- // Check open in new tab selector
+ // Check open in new tab selector.
+ // Mirrors the selector the email editor telemetry and preview save
+ // guard rely on (packages/js/email-editor). WP 7.1 dropped the
+ // `.editor-preview-dropdown__button-external` class; the entry is now a
+ // menu item anchor with target="wp-preview-<postId>". Assert the same
+ // selector so this canary stays faithful to what the product code
+ // matches. Drop the old class once WP 7.1 is the minimum supported
+ // version.
await expect(
- page.locator( '.editor-preview-dropdown__button-external' )
+ page.locator(
+ '.editor-preview-dropdown__button-external, a[role="menuitem"][target^="wp-preview-"]'
+ )
).toBeVisible();
// Close preview dropdown
await editorLocator