Commit 2345b666da6 for woocommerce
commit 2345b666da6ed33dc1516357bf8fdf68a2de5476
Author: Jan Lysý <lysyjan@users.noreply.github.com>
Date: Thu Oct 22 19:43:20 2026 +0200
[Email Editor] Fix telemetry and trash redirect on WordPress 7.2 (#70140)
* Keep the email editor working with WordPress 7.2 editor changes
WordPress 7.2 moved the editor sidebar tabs and header menus to new
components and renamed the "Preview in new tab" menu item. Post actions
for emails now come from core.
- Match the sidebar tabs and the Options menu in the DOM telemetry on
WordPress 7.0, 7.1 and 7.2, and read the open state from aria-expanded.
- Go back to the email list after core's trash action deletes an email,
instead of staying on an empty editor.
- Update the email editor E2E tests to pass on 7.0, 7.1 and 7.2, and add
one for deleting an email from the editor.
* Add changelog entries for email editor WordPress 7.2 fixes
* Read the active email editor sidebar tab from the interface store
* Record the email editor menu state after the click on WordPress 7.2
diff --git a/packages/js/email-editor/changelog/fix-wooplug-8066-email-editor-wp-72 b/packages/js/email-editor/changelog/fix-wooplug-8066-email-editor-wp-72
new file mode 100644
index 00000000000..0a906d87ff2
--- /dev/null
+++ b/packages/js/email-editor/changelog/fix-wooplug-8066-email-editor-wp-72
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Support WordPress 7.2: return to the email list after trashing an email and keep editor telemetry working.
diff --git a/packages/js/email-editor/src/components/block-editor/editor.tsx b/packages/js/email-editor/src/components/block-editor/editor.tsx
index 00ea383c25e..17e52fdcb9a 100644
--- a/packages/js/email-editor/src/components/block-editor/editor.tsx
+++ b/packages/js/email-editor/src/components/block-editor/editor.tsx
@@ -2,7 +2,7 @@
* External dependencies
*/
import { useSelect, useDispatch } from '@wordpress/data';
-import { useMemo, useEffect } from '@wordpress/element';
+import { useCallback, useMemo, useEffect } from '@wordpress/element';
import { SlotFillProvider, ProgressBar } from '@wordpress/components';
import { store as coreStore, Post } from '@wordpress/core-data';
import { CommandMenu, store as commandsStore } from '@wordpress/commands';
@@ -108,13 +108,31 @@ export function InnerEditor( {
// isFullScreenForced – comes from settings and cannot be changed by the user
// isFullscreenEnabled – indicates if a user has enabled fullscreen mode
- const { isFullscreenEnabled, allCommands } = useSelect( ( select ) => {
- return {
- isFullscreenEnabled:
- select( storeName ).isFeatureActive( 'fullscreenMode' ),
- allCommands: select( commandsStore ).getCommands(),
- };
- }, [] );
+ const { isFullscreenEnabled, allCommands, listingsUrl } = useSelect(
+ ( select ) => {
+ return {
+ isFullscreenEnabled:
+ select( storeName ).isFeatureActive( 'fullscreenMode' ),
+ allCommands: select( commandsStore ).getCommands(),
+ listingsUrl: select( storeName ).getUrls()?.listings,
+ };
+ },
+ []
+ );
+
+ // From WordPress 7.2 emails get core's delete actions, which leave it to the editor
+ // screen to move away from the deleted post. Go back to the email list.
+ const onActionPerformed = useCallback(
+ ( actionId: string ) => {
+ if (
+ listingsUrl &&
+ [ 'move-to-trash', 'permanently-delete' ].includes( actionId )
+ ) {
+ window.location.href = listingsUrl;
+ }
+ },
+ [ listingsUrl ]
+ );
const {
isFullScreenForced,
@@ -180,6 +198,7 @@ export function InnerEditor( {
postType={ currentPost.postType }
settings={ editorSettings }
templateId={ template && template.id }
+ onActionPerformed={ onActionPerformed }
contentRef={ contentRef }
styles={ styles } // This is needed for BC for Gutenberg below v22
customSavePanel={ customSavePanel }
diff --git a/packages/js/email-editor/src/events/dom-tracking.ts b/packages/js/email-editor/src/events/dom-tracking.ts
index c3795ec9d72..04a1f97e878 100644
--- a/packages/js/email-editor/src/events/dom-tracking.ts
+++ b/packages/js/email-editor/src/events/dom-tracking.ts
@@ -1,6 +1,7 @@
/**
* External dependencies
*/
+import { select } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
/**
@@ -10,6 +11,26 @@ import { recordEvent, isEventTrackingEnabled } from '.';
let EVENTS_TO_TRACK = [];
+const SIDEBAR_TABS = {
+ 'edit-post/document': 'document',
+ 'edit-post/block': 'block',
+};
+
+/**
+ * Records whether a header menu is open after the click on its toggle.
+ * WordPress 7.2 menus set only `aria-expanded` (no `is-opened` class), and only after the
+ * click event, so the state is read once the click has been handled.
+ */
+function recordMenuToggle( eventName: string, target: Element ) {
+ setTimeout( () => {
+ recordEvent( eventName, {
+ isOpened:
+ target.classList.contains( 'is-opened' ) ||
+ target.getAttribute( 'aria-expanded' ) === 'true',
+ } );
+ } );
+}
+
/**
* Filter events by selector and record the event.
*/
@@ -70,14 +91,9 @@ export function initDomTracking() {
},
// Header more menu toggle
{
- track: ( target ) => {
- const isOpened = target.classList.contains( 'is-opened' );
- recordEvent( 'header_more_menu_dropdown_toggle', {
- isOpened,
- } );
- },
-
- selector: `.components-dropdown-menu__toggle[aria-label="${ __(
+ track: ( target ) =>
+ recordMenuToggle( 'header_more_menu_dropdown_toggle', target ),
+ selector: `.editor-header__settings button[aria-label="${ __(
'Options'
) }"]`,
},
@@ -107,27 +123,27 @@ export function initDomTracking() {
},
// Preview dropdown toggle clicked
{
- track: ( target ) => {
- const isOpened = target.classList.contains( 'is-opened' );
- recordEvent( 'header_preview_dropdown_clicked', {
- isOpened,
- } );
- },
+ track: ( target ) =>
+ recordMenuToggle( 'header_preview_dropdown_clicked', target ),
selector: '.editor-preview-dropdown__toggle',
},
- // Email tab in the sidebar clicked
+ // Email or Block tab in the sidebar clicked
{
+ // The editor has already switched the sidebar when the click reaches the document.
track: () => {
- recordEvent( 'sidebar_tab_selected', { tab: 'document' } );
- },
- selector: '[data-tab-id="edit-post/document"]',
- },
- // Block tab in the sidebar clicked
- {
- track: () => {
- recordEvent( 'sidebar_tab_selected', { tab: 'block' } );
+ const tab =
+ SIDEBAR_TABS[
+ select( 'core/interface' ).getActiveComplementaryArea(
+ 'core'
+ )
+ ];
+ if ( tab ) {
+ recordEvent( 'sidebar_tab_selected', { tab } );
+ }
},
- selector: '[data-tab-id="edit-post/block"]',
+ // WordPress 7.0 renders the tabs with role="button", but with `data-tab-id`.
+ selector:
+ '.editor-sidebar__panel-tabs [data-tab-id], .editor-sidebar__panel-tabs [role="tab"]',
},
// Header inserter sidebar toggle clicked
{
diff --git a/packages/js/email-editor/src/events/test/dom-tracking.spec.ts b/packages/js/email-editor/src/events/test/dom-tracking.spec.ts
new file mode 100644
index 00000000000..0eb2271dfda
--- /dev/null
+++ b/packages/js/email-editor/src/events/test/dom-tracking.spec.ts
@@ -0,0 +1,193 @@
+/**
+ * External dependencies
+ */
+import { select } from '@wordpress/data';
+
+/**
+ * Internal dependencies
+ */
+import { initDomTracking } from '../dom-tracking';
+import { recordEvent } from '..';
+
+jest.mock( '..', () => ( {
+ recordEvent: jest.fn(),
+ isEventTrackingEnabled: () => true,
+} ) );
+
+jest.mock( '@wordpress/data', () => ( {
+ select: jest.fn(),
+} ) );
+
+// The editor switches its sidebar before the click reaches the document.
+function setActiveSidebar( sidebar: string | null ) {
+ jest.mocked( select ).mockReturnValue( {
+ getActiveComplementaryArea: () => sidebar,
+ } );
+}
+
+// Sidebar tabs as rendered by WordPress 7.0 and 7.1 (components Tabs) and 7.2 (Base UI Tabs).
+const SIDEBAR_TABS_WP70 = `
+ <div class="components-panel__header interface-complementary-area-header editor-sidebar__panel-tabs">
+ <div role="tablist">
+ <button type="button" role="button" data-tab-id="edit-post/document">Email</button>
+ <button type="button" role="button" data-tab-id="edit-post/block">Block</button>
+ </div>
+ </div>`;
+const SIDEBAR_TABS_WP71 = `
+ <div class="components-panel__header interface-complementary-area-header editor-sidebar__panel-tabs">
+ <div role="tablist">
+ <button type="button" role="tab" data-tab-id="edit-post/document">Email</button>
+ <button type="button" role="tab" data-tab-id="edit-post/block">Block</button>
+ </div>
+ </div>`;
+const SIDEBAR_TABS_WP72 = `
+ <div class="components-panel__header interface-complementary-area-header editor-sidebar__panel-tabs">
+ <div role="tablist">
+ <button type="button" role="tab" id="base-ui-:rl:"><span>Email</span></button>
+ <button type="button" role="tab" id="base-ui-:rm:"><span>Block</span></button>
+ </div>
+ </div>`;
+
+// Header "Options" toggle as rendered by WordPress 7.1 (DropdownMenu) and 7.2 (Base UI Menu).
+const optionsToggleWp71 = ( isOpened: boolean ) => `
+ <div class="editor-header__settings">
+ <button type="button" aria-expanded="${ isOpened }" class="components-button components-dropdown-menu__toggle is-compact has-icon${
+ isOpened ? ' is-opened' : ''
+ }" aria-label="Options"><svg></svg></button>
+ </div>`;
+const optionsToggleWp72 = ( isOpened: boolean ) => `
+ <div class="editor-header__settings">
+ <button type="button" aria-haspopup="menu" aria-expanded="${ isOpened }" class="components-button is-compact has-icon" aria-label="Options"><svg></svg></button>
+ </div>`;
+
+// Header "View" (preview) toggle as rendered by WordPress 7.2 (Base UI Menu).
+const previewToggleWp72 = ( isOpened: boolean ) => `
+ <button type="button" aria-haspopup="menu" aria-expanded="${ isOpened }" class="components-button editor-preview-dropdown__toggle is-compact has-icon" aria-label="View"><svg></svg></button>`;
+
+function click( selector: string ) {
+ const element = document.querySelector( selector );
+ if ( ! element ) {
+ throw new Error( `No element matches ${ selector }` );
+ }
+ element.dispatchEvent(
+ new window.MouseEvent( 'click', { bubbles: true } )
+ );
+}
+
+describe( 'initDomTracking', () => {
+ beforeAll( () => {
+ initDomTracking();
+ } );
+
+ afterEach( () => {
+ document.body.innerHTML = '';
+ jest.mocked( recordEvent ).mockClear();
+ } );
+
+ describe.each( [
+ [ 'WordPress 7.0', SIDEBAR_TABS_WP70 ],
+ [ 'WordPress 7.1', SIDEBAR_TABS_WP71 ],
+ [ 'WordPress 7.2', SIDEBAR_TABS_WP72 ],
+ ] )( 'sidebar tabs (%s)', ( _version, markup ) => {
+ it.each( [
+ [ ':first-child', 'edit-post/document', 'document' ],
+ [ ':last-child', 'edit-post/block', 'block' ],
+ ] )(
+ 'records the tab the editor switched to (%s)',
+ ( tabSelector, sidebar, tab ) => {
+ document.body.innerHTML = markup;
+ setActiveSidebar( sidebar );
+ click( `[role="tablist"] > ${ tabSelector }` );
+ expect( select ).toHaveBeenCalledWith( 'core/interface' );
+ expect( recordEvent ).toHaveBeenCalledTimes( 1 );
+ expect( recordEvent ).toHaveBeenCalledWith(
+ 'sidebar_tab_selected',
+ { tab }
+ );
+ }
+ );
+
+ it( 'records nothing when another sidebar is active', () => {
+ document.body.innerHTML = markup;
+ setActiveSidebar( 'woocommerce/email-editor-styles' );
+ click( '[role="tablist"] > :first-child' );
+ expect( recordEvent ).not.toHaveBeenCalled();
+ } );
+ } );
+
+ it( 'ignores tabs outside the editor sidebar header', () => {
+ document.body.innerHTML = `
+ <div class="block-editor-inserter__tabs">
+ <div role="tablist"><button type="button" role="tab">Blocks</button></div>
+ </div>`;
+ click( '[role="tab"]' );
+ expect( recordEvent ).not.toHaveBeenCalled();
+ } );
+
+ // WordPress 7.1 menus are open or closed by the time the click reaches the document.
+ // WordPress 7.2 menus update `aria-expanded` after the click event.
+ describe( 'header menu toggles', () => {
+ beforeEach( () => {
+ jest.useFakeTimers();
+ } );
+
+ afterEach( () => {
+ jest.useRealTimers();
+ } );
+
+ it.each( [ false, true ] )(
+ 'records the WordPress 7.1 options toggle with isOpened %s',
+ ( isOpened ) => {
+ document.body.innerHTML = optionsToggleWp71( isOpened );
+ click( '[aria-label="Options"] svg' );
+ jest.runAllTimers();
+ expect( recordEvent ).toHaveBeenCalledTimes( 1 );
+ expect( recordEvent ).toHaveBeenCalledWith(
+ 'header_more_menu_dropdown_toggle',
+ { isOpened }
+ );
+ }
+ );
+
+ it.each( [
+ [
+ 'options',
+ optionsToggleWp72,
+ '[aria-label="Options"]',
+ 'header_more_menu_dropdown_toggle',
+ ],
+ [
+ 'preview',
+ previewToggleWp72,
+ '.editor-preview-dropdown__toggle',
+ 'header_preview_dropdown_clicked',
+ ],
+ ] )(
+ 'records the WordPress 7.2 %s toggle state after the click',
+ ( _toggle, markup, selector, eventName ) => {
+ for ( const isOpened of [ true, false ] ) {
+ document.body.innerHTML = markup( ! isOpened );
+ click( selector );
+ document
+ .querySelector( selector )
+ ?.setAttribute( 'aria-expanded', String( isOpened ) );
+ jest.runAllTimers();
+ expect( recordEvent ).toHaveBeenLastCalledWith( eventName, {
+ isOpened,
+ } );
+ }
+ expect( recordEvent ).toHaveBeenCalledTimes( 2 );
+ }
+ );
+
+ it( 'does not record the block toolbar options toggle as the header menu', () => {
+ document.body.innerHTML = `
+ <div class="block-editor-block-toolbar">
+ <button type="button" class="components-button components-dropdown-menu__toggle" aria-label="Options"></button>
+ </div>`;
+ click( '[aria-label="Options"]' );
+ jest.runAllTimers();
+ expect( recordEvent ).not.toHaveBeenCalled();
+ } );
+ } );
+} );
diff --git a/packages/js/email-editor/src/hacks/README.md b/packages/js/email-editor/src/hacks/README.md
index a8a85be9191..f17c986bddf 100644
--- a/packages/js/email-editor/src/hacks/README.md
+++ b/packages/js/email-editor/src/hacks/README.md
@@ -48,6 +48,8 @@ Each hack below represents functionality that should ideally be supported throug
**Upstream solution needed:** A filter or configuration option to customize built-in entity actions without needing to unregister and re-register them.
+**WordPress 7.2+:** Entity actions are registered on the server (`wp_entity_actions_api_init`) and `core.registerPostTypeSchema` no longer fires in the email editor, so this hack has no effect. Core's trash action is shown instead; the editor sends the user back to the email list after it (`onActionPerformed` in [editor.tsx](../components/block-editor/editor.tsx)).
+
---
### 4. Template Actions Modification ([modify-template-actions.tsx](modify-template-actions.tsx))
@@ -61,6 +63,8 @@ Each hack below represents functionality that should ideally be supported throug
- Registers a custom reset template action that maintains previous behavior
- Applies modifications only to `wp_template` post type
+**WordPress 7.2+:** Like the trash hack, this has no effect. Core's "Reset" action resets email templates correctly, and core no longer offers "Duplicate" for templates.
+
**Solution needed:** We need to find out how to align the email editor with the Active Templates feature. We should aim to integrate with the Site editor to add support for email templates and that way we could support the template management and new actions introduced in the Active Templates feature.
---
diff --git a/plugins/woocommerce/changelog/fix-wooplug-8066-email-editor-wp-72 b/plugins/woocommerce/changelog/fix-wooplug-8066-email-editor-wp-72
new file mode 100644
index 00000000000..08db14f9f28
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-wooplug-8066-email-editor-wp-72
@@ -0,0 +1,5 @@
+Significance: patch
+Type: dev
+Comment: Update email editor E2E tests for WordPress 7.2 editor changes; no production change.
+
+
diff --git a/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-delete.spec.ts b/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-delete.spec.ts
new file mode 100644
index 00000000000..d2eada13a44
--- /dev/null
+++ b/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-delete.spec.ts
@@ -0,0 +1,94 @@
+/**
+ * External dependencies
+ */
+import { createClient, WP_API_PATH } from '@woocommerce/e2e-utils-playwright';
+
+/**
+ * Internal dependencies
+ */
+import { expect, test, locks } from '../../fixtures/fixtures';
+import { ADMIN_STATE_PATH } from '../../playwright.config';
+import {
+ deleteEmailPost,
+ disableEmailEditor,
+ enableEmailEditor,
+} from './helpers/enable-email-editor-feature';
+import { accessTheEmailEditor } from '../../utils/email';
+import { admin } from '../../test-data/data';
+
+test.describe(
+ 'WooCommerce Email Editor Delete',
+ { lock: locks.EMAIL_FEATURE_FLAGS },
+ () => {
+ test.use( { storageState: ADMIN_STATE_PATH } );
+
+ let emailPostId: string | null = null;
+
+ test.beforeAll( async ( { baseURL } ) => {
+ await enableEmailEditor( baseURL );
+ } );
+
+ test.afterAll( async ( { baseURL } ) => {
+ try {
+ if ( emailPostId ) {
+ // Up to WP 7.1 the test already deleted the post permanently.
+ await deleteEmailPost( baseURL, emailPostId ).catch(
+ ( error ) => {
+ if ( error.response?.status !== 404 ) {
+ throw error;
+ }
+ }
+ );
+ }
+ } finally {
+ await disableEmailEditor( baseURL );
+ }
+ } );
+
+ test( 'Deleting an email from the editor opens the email listing', async ( {
+ page,
+ baseURL,
+ } ) => {
+ await accessTheEmailEditor( page, 'Customer note' );
+ emailPostId = new URL( page.url() ).searchParams.get( 'post' );
+ expect( emailPostId ).toMatch( /^[1-9]\d*$/ );
+
+ // WP 7.0 renders the sidebar tabs with the button role.
+ await page
+ .getByRole( 'tab', { name: 'Email' } )
+ .or(
+ page.getByRole( 'button', { name: 'Email', exact: true } )
+ )
+ .click();
+ await page
+ .locator( '.editor-sidebar' )
+ .getByRole( 'button', { name: 'Actions' } )
+ .first()
+ .click();
+ // Up to WP 7.1 the email editor's own action permanently deletes the
+ // email. From WP 7.2 core's "Trash…" action moves it to the trash.
+ await page
+ .getByRole( 'menuitem', { name: /permanently delete|trash/i } )
+ .click();
+ await page
+ .getByRole( 'dialog' )
+ .getByRole( 'button', { name: /delete permanently|trash/i } )
+ .click();
+
+ await expect( page ).toHaveURL( /page=wc-settings&tab=email/ );
+
+ const apiClient = createClient( baseURL, {
+ type: 'basic',
+ username: admin.username,
+ password: admin.password,
+ } );
+ const postState = await apiClient
+ .get(
+ `${ WP_API_PATH }/woo_email/${ emailPostId }?context=edit`
+ )
+ .then( ( response ) => response.data.status )
+ .catch( ( error ) => error.response?.status );
+ expect( [ 'trash', 404 ] ).toContain( postState );
+ } );
+ }
+);
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 4917601545b..349e6a29f5d 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
@@ -16,6 +16,9 @@ import {
import { accessTheEmailEditor, openEmailPostInEditor } from '../../utils/email';
import { setOption } from '../../utils/options';
+// WP 7.2 renamed "Preview in new tab" to "Preview" with an "(opens in a new tab)" icon label.
+const PREVIEW_IN_NEW_TAB = /^Preview (in new tab|\(opens in a new tab\))$/;
+
test.describe(
'WooCommerce Email Editor Core',
{ lock: locks.EMAIL_FEATURE_FLAGS },
@@ -131,7 +134,7 @@ test.describe(
const [ newPage ] = await Promise.all( [
page.waitForEvent( 'popup' ), // Waits for the new tab to open
page
- .getByRole( 'menuitem', { name: 'Preview in new tab' } )
+ .getByRole( 'menuitem', { name: PREVIEW_IN_NEW_TAB } )
.click(),
] );
try {
@@ -240,7 +243,7 @@ test.describe(
.click();
const page1Promise = page.waitForEvent( 'popup' );
await page
- .getByRole( 'menuitem', { name: 'Preview in new tab' } )
+ .getByRole( 'menuitem', { name: PREVIEW_IN_NEW_TAB } )
.click();
const page1 = await page1Promise;
try {
diff --git a/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-reset-template.spec.ts b/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-reset-template.spec.ts
index ab7328017db..b88733a7e33 100644
--- a/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-reset-template.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/email-editor/email-editor-reset-template.spec.ts
@@ -127,9 +127,12 @@ test.describe(
// Click the Reset action
await page.getByRole( 'menuitem', { name: 'Reset' } ).click();
- // Verify the reset confirmation modal appears
+ // Verify the reset confirmation modal appears. Up to WP 7.1 the email
+ // editor shows its own reset action, from WP 7.2 core's.
await expect(
- page.getByText( /Are you sure you want to reset.*to default\?/ )
+ page.getByText(
+ /Are you sure you want to reset.*to default\?|Reset to default and clear all customizations\?/
+ )
).toBeVisible();
// Verify Cancel button exists
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 1e8c8e0a682..e99e2be21a8 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
@@ -64,14 +64,14 @@ test.describe(
'.editor-document-tools__inserter-toggle'
)
).toBeVisible();
- // Check Email tab in the sidebar
+ // Check Email and Block tabs in the sidebar.
+ // Mirrors the email editor telemetry selector: WP 7.2 tabs have no
+ // `data-tab-id`, WP 7.0 tabs have no `role="tab"`.
await expect(
- editorLocator.locator( '[data-tab-id="edit-post/block"]' )
- ).toBeVisible();
- // Check Block tab in the sidebar
- await expect(
- editorLocator.locator( '[data-tab-id="edit-post/document"]' )
- ).toBeVisible();
+ editorLocator.locator(
+ '.editor-sidebar__panel-tabs [data-tab-id], .editor-sidebar__panel-tabs [role="tab"]'
+ )
+ ).toHaveCount( 2 );
// Check preview dropdown toggle
await expect(
editorLocator.locator( '.editor-preview-dropdown__toggle' )
@@ -97,7 +97,7 @@ test.describe(
// Check more menu toggle selector
await expect(
editorLocator.locator(
- '.components-dropdown-menu__toggle[aria-label="Options"]'
+ '.editor-header__settings button[aria-label="Options"]'
)
).toBeVisible();
@@ -140,18 +140,13 @@ test.describe(
await page.keyboard.press( 'Escape' );
// Check header block tools toggle button
- // Enable header block tools
- await editorLocator
- .locator(
- '.components-dropdown-menu__toggle[aria-label="Options"]'
- )
- .click();
- // Check header preview dropdown preview in new tab selected
- // Click header preview dropdown preview in new tab
- await page
- .locator( '.components-popover' )
- .getByText( 'Top toolbar' )
- .click();
+ // Enable header block tools. WP 7.2 moved "Top toolbar" into the
+ // Options > Appearance submenu, so set the preference directly.
+ await page.evaluate( () =>
+ window.wp.data
+ .dispatch( 'core/preferences' )
+ .set( 'core', 'fixedToolbar', true )
+ );
// Click canvas to select a block to make top toolbar visible
await page
.frameLocator( 'iframe[name="editor-canvas"]' )