From d655af640e94a96299c54a588b8b4ba5d0fb3682 Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Tue, 15 Oct 2024 08:46:53 +0200 Subject: [PATCH] Remove the verb Toggle from the Block Inserter button. (#65983) * Remove the verb Toggle from the Block Inserter button. * Adjust tests. * Try to fix performance test. * Try to fix perf test --------- Co-authored-by: afercia Co-authored-by: t-hamano Co-authored-by: draganescu Co-authored-by: tyxla Co-authored-by: kristastevens Co-authored-by: SantosGuillamot Co-authored-by: talldan Co-authored-by: ramonjd Co-authored-by: youknowriad --- .../src/components/inserter/menu.js | 2 +- packages/e2e-test-utils/src/inserter.js | 14 ++++---- .../components/header/document-tools/index.js | 2 +- .../secondary-sidebar/inserter-sidebar.js | 2 +- .../src/components/document-tools/index.js | 2 +- test/e2e/specs/editor/blocks/columns.spec.js | 6 ++-- test/e2e/specs/editor/blocks/group.spec.js | 2 +- test/e2e/specs/editor/blocks/image.spec.js | 3 +- .../editor/plugins/allowed-blocks.spec.js | 2 +- .../editor/plugins/block-directory.spec.js | 4 +-- .../specs/editor/plugins/block-icons.spec.js | 10 +++--- .../editor/plugins/block-variations.spec.js | 4 +-- .../specs/editor/plugins/child-blocks.spec.js | 6 ++-- .../inner-blocks-allowed-blocks.spec.js | 4 +-- .../editor/plugins/pattern-recursion.spec.js | 4 +-- .../editor/plugins/post-type-locking.spec.js | 5 ++- .../plugins/register-block-type-hooks.spec.js | 2 +- test/e2e/specs/editor/various/a11y.spec.js | 4 +-- .../editor/various/adding-patterns.spec.js | 2 +- .../editor/various/allowed-patterns.spec.js | 4 +-- .../editor/various/block-visibility.spec.js | 12 +++---- .../specs/editor/various/editor-modes.spec.js | 2 +- .../editor/various/inserting-blocks.spec.js | 23 ++++++------- .../editor/various/parsing-patterns.spec.js | 2 +- .../e2e/specs/editor/various/patterns.spec.js | 6 ++-- .../various/shortcut-focus-toolbar.spec.js | 4 +-- .../block-style-variations.spec.js | 2 +- test/e2e/specs/site-editor/pages.spec.js | 4 ++- .../site-editor/site-editor-inserter.spec.js | 7 ++-- test/e2e/specs/site-editor/style-book.spec.js | 2 +- .../e2e/specs/widgets/editing-widgets.spec.js | 4 +-- test/performance/specs/post-editor.spec.js | 32 ++++++++++++------- 32 files changed, 99 insertions(+), 85 deletions(-) diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index fa72728f6de20c..bdd4ff11abceee 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -322,7 +322,7 @@ function InserterMenu( onSelect={ handleSetSelectedTab } onClose={ onClose } selectedTab={ selectedTab } - closeButtonLabel={ __( 'Close block inserter' ) } + closeButtonLabel={ __( 'Close Block Inserter' ) } tabs={ [ { name: 'blocks', diff --git a/packages/e2e-test-utils/src/inserter.js b/packages/e2e-test-utils/src/inserter.js index 5beab3c6205b6e..90ea39b49f00d6 100644 --- a/packages/e2e-test-utils/src/inserter.js +++ b/packages/e2e-test-utils/src/inserter.js @@ -49,12 +49,12 @@ async function isGlobalInserterOpen() { return !! document.querySelector( '.edit-post-header [aria-label="Add block"].is-pressed,' + '.edit-site-header-edit-mode [aria-label="Add block"].is-pressed,' + - '.edit-post-header [aria-label="Toggle block inserter"].is-pressed,' + - '.edit-site-header [aria-label="Toggle block inserter"].is-pressed,' + - '.edit-widgets-header [aria-label="Toggle block inserter"].is-pressed,' + + '.edit-post-header [aria-label="Block Inserter"].is-pressed,' + + '.edit-site-header [aria-label="Block Inserter"].is-pressed,' + + '.edit-widgets-header [aria-label="Block Inserter"].is-pressed,' + '.edit-widgets-header [aria-label="Add block"].is-pressed,' + '.edit-site-header-edit-mode__inserter-toggle.is-pressed,' + - '.editor-header [aria-label="Toggle block inserter"].is-pressed' + '.editor-header [aria-label="Block Inserter"].is-pressed' ); } ); } @@ -68,10 +68,10 @@ export async function toggleGlobalBlockInserter() { '.editor-document-tools__inserter-toggle,' + '.edit-post-header [aria-label="Add block"],' + '.edit-site-header [aria-label="Add block"],' + - '.edit-post-header [aria-label="Toggle block inserter"],' + - '.edit-site-header [aria-label="Toggle block inserter"],' + + '.edit-post-header [aria-label="Block Inserter"],' + + '.edit-site-header [aria-label="Block Inserter"],' + '.edit-widgets-header [aria-label="Add block"],' + - '.edit-widgets-header [aria-label="Toggle block inserter"],' + + '.edit-widgets-header [aria-label="Block Inserter"],' + '.edit-site-header-edit-mode__inserter-toggle' ); } diff --git a/packages/edit-widgets/src/components/header/document-tools/index.js b/packages/edit-widgets/src/components/header/document-tools/index.js index a0d69cde376cf7..567a5e1240747e 100644 --- a/packages/edit-widgets/src/components/header/document-tools/index.js +++ b/packages/edit-widgets/src/components/header/document-tools/index.js @@ -72,7 +72,7 @@ function DocumentTools() { /* translators: button label text should, if possible, be under 16 characters. */ label={ _x( - 'Toggle block inserter', + 'Block Inserter', 'Generic label for block inserter button' ) } size="compact" diff --git a/packages/edit-widgets/src/components/secondary-sidebar/inserter-sidebar.js b/packages/edit-widgets/src/components/secondary-sidebar/inserter-sidebar.js index 156a15e2f460ca..4b26dd306ea0a3 100644 --- a/packages/edit-widgets/src/components/secondary-sidebar/inserter-sidebar.js +++ b/packages/edit-widgets/src/components/secondary-sidebar/inserter-sidebar.js @@ -47,7 +47,7 @@ export default function InserterSidebar() { __next40pxDefaultSize icon={ close } onClick={ closeInserter } - label={ __( 'Close block inserter' ) } + label={ __( 'Close Block Inserter' ) } />
diff --git a/packages/editor/src/components/document-tools/index.js b/packages/editor/src/components/document-tools/index.js index 6a8c20c8d70551..146945f7343bf2 100644 --- a/packages/editor/src/components/document-tools/index.js +++ b/packages/editor/src/components/document-tools/index.js @@ -96,7 +96,7 @@ function DocumentTools( { className, disableBlockTools = false } ) { /* translators: button label text should, if possible, be under 16 characters. */ const longLabel = _x( - 'Toggle block inserter', + 'Block Inserter', 'Generic label for block inserter button' ); const shortLabel = ! isInserterOpened ? __( 'Add' ) : __( 'Close' ); diff --git a/test/e2e/specs/editor/blocks/columns.spec.js b/test/e2e/specs/editor/blocks/columns.spec.js index e322a52eeba10b..eea6e321aacb11 100644 --- a/test/e2e/specs/editor/blocks/columns.spec.js +++ b/test/e2e/specs/editor/blocks/columns.spec.js @@ -33,10 +33,8 @@ test.describe( 'Columns', () => { .first() .click(); - // Toggle Block inserter - await page - .locator( 'role=button[name="Toggle block inserter"i]' ) - .click(); + // Block Inserter + await page.locator( 'role=button[name="Block Inserter"i]' ).click(); // Verify Column const inserterOptions = page.locator( diff --git a/test/e2e/specs/editor/blocks/group.spec.js b/test/e2e/specs/editor/blocks/group.spec.js index 871974c1f44dd4..0d815872c0bbb2 100644 --- a/test/e2e/specs/editor/blocks/group.spec.js +++ b/test/e2e/specs/editor/blocks/group.spec.js @@ -14,7 +14,7 @@ test.describe( 'Group', () => { } ) => { // Search for the group block and insert it. const inserterButton = page.locator( - 'role=button[name="Toggle block inserter"i]' + 'role=button[name="Block Inserter"i]' ); await inserterButton.click(); diff --git a/test/e2e/specs/editor/blocks/image.spec.js b/test/e2e/specs/editor/blocks/image.spec.js index 43527b48fbf707..6110a125ff6f7e 100644 --- a/test/e2e/specs/editor/blocks/image.spec.js +++ b/test/e2e/specs/editor/blocks/image.spec.js @@ -437,7 +437,8 @@ test.describe( 'Image', () => { async function openMediaTab() { const blockInserter = page.getByRole( 'button', { - name: 'Toggle block inserter', + name: 'Block Inserter', + exact: true, } ); const isClosed = ( await blockInserter.getAttribute( 'aria-pressed' ) ) === diff --git a/test/e2e/specs/editor/plugins/allowed-blocks.spec.js b/test/e2e/specs/editor/plugins/allowed-blocks.spec.js index 6c8f4ead41c6f9..ed7490afe84fe9 100644 --- a/test/e2e/specs/editor/plugins/allowed-blocks.spec.js +++ b/test/e2e/specs/editor/plugins/allowed-blocks.spec.js @@ -21,7 +21,7 @@ test.describe( 'Allowed Blocks Filter', () => { } ) => { // The paragraph block is available. await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const searchbox = page diff --git a/test/e2e/specs/editor/plugins/block-directory.spec.js b/test/e2e/specs/editor/plugins/block-directory.spec.js index f9bf1f85151864..2fa4ee33e6c1ab 100644 --- a/test/e2e/specs/editor/plugins/block-directory.spec.js +++ b/test/e2e/specs/editor/plugins/block-directory.spec.js @@ -122,7 +122,7 @@ test.describe( 'Block Directory', () => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { @@ -209,7 +209,7 @@ test.describe( 'Block Directory', () => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { diff --git a/test/e2e/specs/editor/plugins/block-icons.spec.js b/test/e2e/specs/editor/plugins/block-icons.spec.js index 0418f4200afc05..3a00b41b9e71ed 100644 --- a/test/e2e/specs/editor/plugins/block-icons.spec.js +++ b/test/e2e/specs/editor/plugins/block-icons.spec.js @@ -26,7 +26,7 @@ test.describe( 'Block Icons', () => { test( 'Block with svg icon', async ( { editor, page } ) => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { @@ -60,7 +60,7 @@ test.describe( 'Block Icons', () => { test( 'Block with dash icon', async ( { editor, page } ) => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { @@ -100,7 +100,7 @@ test.describe( 'Block Icons', () => { test( 'Block with function icon', async ( { editor, page } ) => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { @@ -137,7 +137,7 @@ test.describe( 'Block Icons', () => { } ) => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { @@ -185,7 +185,7 @@ test.describe( 'Block Icons', () => { } ) => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { diff --git a/test/e2e/specs/editor/plugins/block-variations.spec.js b/test/e2e/specs/editor/plugins/block-variations.spec.js index 653680b48e1e66..3f71d2b57d9fd1 100644 --- a/test/e2e/specs/editor/plugins/block-variations.spec.js +++ b/test/e2e/specs/editor/plugins/block-variations.spec.js @@ -22,7 +22,7 @@ test.describe( 'Block variations', () => { page, } ) => { await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page @@ -63,7 +63,7 @@ test.describe( 'Block variations', () => { page, } ) => { await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page diff --git a/test/e2e/specs/editor/plugins/child-blocks.spec.js b/test/e2e/specs/editor/plugins/child-blocks.spec.js index 0cd043c6a46105..765b4040a4b976 100644 --- a/test/e2e/specs/editor/plugins/child-blocks.spec.js +++ b/test/e2e/specs/editor/plugins/child-blocks.spec.js @@ -19,7 +19,7 @@ test.describe( 'Child Blocks', () => { test( 'are hidden from the global block inserter', async ( { page } ) => { const blockInserter = page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ); + .getByRole( 'button', { name: 'Block Inserter', exact: true } ); const blockLibrary = page.getByRole( 'region', { name: 'Block Library', } ); @@ -47,7 +47,7 @@ test.describe( 'Child Blocks', () => { const blockInserter = page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ); + .getByRole( 'button', { name: 'Block Inserter', exact: true } ); const blockLibrary = page .getByRole( 'region', { name: 'Block Library', @@ -85,7 +85,7 @@ test.describe( 'Child Blocks', () => { const blockInserter = page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ); + .getByRole( 'button', { name: 'Block Inserter', exact: true } ); const blockLibrary = page .getByRole( 'region', { name: 'Block Library', diff --git a/test/e2e/specs/editor/plugins/inner-blocks-allowed-blocks.spec.js b/test/e2e/specs/editor/plugins/inner-blocks-allowed-blocks.spec.js index d2dc521f0196bd..4ee6d7a0fc4fec 100644 --- a/test/e2e/specs/editor/plugins/inner-blocks-allowed-blocks.spec.js +++ b/test/e2e/specs/editor/plugins/inner-blocks-allowed-blocks.spec.js @@ -45,7 +45,7 @@ test.describe( 'Allowed Blocks Setting on InnerBlocks', () => { const blockInserter = page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ); + .getByRole( 'button', { name: 'Block Inserter', exact: true } ); const blockLibrary = page .getByRole( 'region', { name: 'Block Library', @@ -92,7 +92,7 @@ test.describe( 'Allowed Blocks Setting on InnerBlocks', () => { const blockInserter = page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ); + .getByRole( 'button', { name: 'Block Inserter', exact: true } ); const blockLibrary = page .getByRole( 'region', { name: 'Block Library', diff --git a/test/e2e/specs/editor/plugins/pattern-recursion.spec.js b/test/e2e/specs/editor/plugins/pattern-recursion.spec.js index 9a8292271be8e1..c688f3580c3701 100644 --- a/test/e2e/specs/editor/plugins/pattern-recursion.spec.js +++ b/test/e2e/specs/editor/plugins/pattern-recursion.spec.js @@ -59,9 +59,9 @@ test.describe( 'Preventing Pattern Recursion (server)', () => { page, editor, } ) => { - // Click the Toggle block inserter button + // Click the Block Inserter button await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); // Click the Patterns tab await page.getByRole( 'tab', { name: 'Patterns' } ).click(); diff --git a/test/e2e/specs/editor/plugins/post-type-locking.spec.js b/test/e2e/specs/editor/plugins/post-type-locking.spec.js index af6256d05e02eb..ff02d18c51464b 100644 --- a/test/e2e/specs/editor/plugins/post-type-locking.spec.js +++ b/test/e2e/specs/editor/plugins/post-type-locking.spec.js @@ -208,7 +208,10 @@ test.describe( 'Post-type locking', () => { await expect( page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { + name: 'Block Inserter', + exact: true, + } ) ).toBeEnabled(); await editor.insertBlock( { name: 'core/list' } ); diff --git a/test/e2e/specs/editor/plugins/register-block-type-hooks.spec.js b/test/e2e/specs/editor/plugins/register-block-type-hooks.spec.js index 2ec62ffd056d31..a7e6f970179a4a 100644 --- a/test/e2e/specs/editor/plugins/register-block-type-hooks.spec.js +++ b/test/e2e/specs/editor/plugins/register-block-type-hooks.spec.js @@ -18,7 +18,7 @@ test.describe( 'Register block type hooks', () => { } ); test( 'has a custom category for Paragraph block', async ( { page } ) => { - await page.click( 'role=button[name="Toggle block inserter"i]' ); + await page.click( 'role=button[name="Block Inserter"i]' ); expect( page.locator( diff --git a/test/e2e/specs/editor/various/a11y.spec.js b/test/e2e/specs/editor/various/a11y.spec.js index 8f63b57fda657f..f116476989a133 100644 --- a/test/e2e/specs/editor/various/a11y.spec.js +++ b/test/e2e/specs/editor/various/a11y.spec.js @@ -40,10 +40,10 @@ test.describe( 'a11y (@firefox, @webkit)', () => { // This test assumes the Editor is not in Fullscreen mode. Check the // first tabbable element within the 'Editor top bar' region is the - // 'Toggle block inserter' button. + // 'Block Inserter' button. await pageUtils.pressKeys( 'Tab' ); await expect( - page.locator( 'role=button[name=/Toggle block inserter/i]' ) + page.locator( 'role=button[name=/Block Inserter/i]' ) ).toBeFocused(); } ); diff --git a/test/e2e/specs/editor/various/adding-patterns.spec.js b/test/e2e/specs/editor/various/adding-patterns.spec.js index b634798b455403..3226965b18d703 100644 --- a/test/e2e/specs/editor/various/adding-patterns.spec.js +++ b/test/e2e/specs/editor/various/adding-patterns.spec.js @@ -9,7 +9,7 @@ test.describe( 'adding patterns', () => { } ); test( 'should insert a block pattern', async ( { page, editor } ) => { - await page.getByLabel( 'Toggle block inserter' ).click(); + await page.getByLabel( 'Block Inserter' ).click(); await page.getByRole( 'tab', { name: 'Patterns' } ).click(); await page.fill( diff --git a/test/e2e/specs/editor/various/allowed-patterns.spec.js b/test/e2e/specs/editor/various/allowed-patterns.spec.js index a99b1f5c291066..01ca5ba0480c3a 100644 --- a/test/e2e/specs/editor/various/allowed-patterns.spec.js +++ b/test/e2e/specs/editor/various/allowed-patterns.spec.js @@ -18,7 +18,7 @@ test.describe( 'Allowed Patterns', () => { await admin.createNewPost(); await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page @@ -61,7 +61,7 @@ test.describe( 'Allowed Patterns', () => { await admin.createNewPost(); await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page diff --git a/test/e2e/specs/editor/various/block-visibility.spec.js b/test/e2e/specs/editor/various/block-visibility.spec.js index 814276af6e25f1..6e4163f4ed5839 100644 --- a/test/e2e/specs/editor/various/block-visibility.spec.js +++ b/test/e2e/specs/editor/various/block-visibility.spec.js @@ -43,7 +43,7 @@ test.describe( 'Block Visibility', () => { .getByRole( 'button', { name: 'Close' } ) .click(); await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page .getByRole( 'region', { name: 'Block Library' } ) @@ -60,7 +60,7 @@ test.describe( 'Block Visibility', () => { ).toBeHidden(); await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); // Show heading block again. @@ -84,7 +84,7 @@ test.describe( 'Block Visibility', () => { .getByRole( 'button', { name: 'Close' } ) .click(); await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page .getByRole( 'region', { name: 'Block Library' } ) @@ -118,7 +118,7 @@ test.describe( 'Block Visibility', () => { .getByRole( 'button', { name: 'Close' } ) .click(); await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await expect( @@ -129,7 +129,7 @@ test.describe( 'Block Visibility', () => { ).toBeHidden(); await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); // Show Media category blocks again. @@ -153,7 +153,7 @@ test.describe( 'Block Visibility', () => { .getByRole( 'button', { name: 'Close' } ) .click(); await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await expect( diff --git a/test/e2e/specs/editor/various/editor-modes.spec.js b/test/e2e/specs/editor/various/editor-modes.spec.js index 95c409f0589e31..4e856e6214ca8c 100644 --- a/test/e2e/specs/editor/various/editor-modes.spec.js +++ b/test/e2e/specs/editor/various/editor-modes.spec.js @@ -115,7 +115,7 @@ test.describe( 'Editing modes (visual/HTML)', () => { await expect( page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) ).toBeDisabled(); // Go back to the visual editor. diff --git a/test/e2e/specs/editor/various/inserting-blocks.spec.js b/test/e2e/specs/editor/various/inserting-blocks.spec.js index 83b919585a695c..29b59b727acfef 100644 --- a/test/e2e/specs/editor/various/inserting-blocks.spec.js +++ b/test/e2e/specs/editor/various/inserting-blocks.spec.js @@ -72,7 +72,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { ); await page.click( - 'role=region[name="Editor top bar"i] >> role=button[name="Toggle block inserter"i]' + 'role=region[name="Editor top bar"i] >> role=button[name="Block Inserter"i]' ); await page.fill( @@ -135,7 +135,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { ); await page.click( - 'role=region[name="Editor top bar"i] >> role=button[name="Toggle block inserter"i]' + 'role=region[name="Editor top bar"i] >> role=button[name="Block Inserter"i]' ); await page.fill( @@ -191,7 +191,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { ); await page.click( - 'role=region[name="Editor top bar"i] >> role=button[name="Toggle block inserter"i]' + 'role=region[name="Editor top bar"i] >> role=button[name="Block Inserter"i]' ); const PATTERN_NAME = 'Standard'; @@ -283,7 +283,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { // Insert a synced pattern. await page.click( - 'role=region[name="Editor top bar"i] >> role=button[name="Toggle block inserter"i]' + 'role=region[name="Editor top bar"i] >> role=button[name="Block Inserter"i]' ); await page.fill( 'role=region[name="Block Library"i] >> role=searchbox[name="Search"i]', @@ -347,7 +347,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { ); await page.click( - 'role=region[name="Editor top bar"i] >> role=button[name="Toggle block inserter"i]' + 'role=region[name="Editor top bar"i] >> role=button[name="Block Inserter"i]' ); const PATTERN_NAME = 'Standard'; @@ -389,7 +389,8 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { await admin.createNewPost(); const inserterButton = page.getByRole( 'button', { - name: 'Toggle block inserter', + name: 'Block Inserter', + exact: true, } ); const blockLibrary = page.getByRole( 'region', { name: 'Block Library', @@ -503,7 +504,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { await editor.selectBlocks( paragraphBlock ); await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page .getByRole( 'listbox', { name: 'Text' } ) @@ -624,7 +625,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { await admin.createNewPost(); await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page.getByRole( 'option', { name: 'More', exact: true } ).click(); @@ -646,7 +647,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { await admin.createNewPost(); await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page .getByRole( 'listbox', { name: 'Text' } ) @@ -674,7 +675,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page .getByRole( 'listbox', { name: 'Media' } ) @@ -726,7 +727,7 @@ test.describe( 'insert media from inserter', () => { } ) => { await admin.createNewPost(); - await page.getByLabel( 'Toggle block inserter' ).click(); + await page.getByLabel( 'Block Inserter' ).click(); await page.getByRole( 'tab', { name: 'Media' } ).click(); await page.getByRole( 'tab', { name: 'Images' } ).click(); await page.getByLabel( uploadedMedia.title.raw ).click(); diff --git a/test/e2e/specs/editor/various/parsing-patterns.spec.js b/test/e2e/specs/editor/various/parsing-patterns.spec.js index fd9305d0db786f..d8edc544ffa03c 100644 --- a/test/e2e/specs/editor/various/parsing-patterns.spec.js +++ b/test/e2e/specs/editor/various/parsing-patterns.spec.js @@ -15,7 +15,7 @@ test.describe( 'Parsing patterns', () => { innerBlocks: [ { name: 'core/button', attributes: { text: 'a' } } ], } ); await page.keyboard.press( 'ArrowDown' ); - await page.getByLabel( 'Toggle block inserter' ).click(); + await page.getByLabel( 'Block Inserter' ).click(); await page.getByRole( 'tab', { name: 'Patterns' } ).click(); await page.evaluate( () => { diff --git a/test/e2e/specs/editor/various/patterns.spec.js b/test/e2e/specs/editor/various/patterns.spec.js index 7204f2bace51a5..00a68a9f08ea55 100644 --- a/test/e2e/specs/editor/various/patterns.spec.js +++ b/test/e2e/specs/editor/various/patterns.spec.js @@ -63,7 +63,7 @@ test.describe( 'Unsynced pattern', () => { // Check that the new pattern is available in the inserter and that it gets inserted as // a plain paragraph block. - await page.getByLabel( 'Toggle block inserter' ).click(); + await page.getByLabel( 'Block Inserter' ).click(); await page .getByRole( 'tab', { name: 'Patterns', @@ -166,7 +166,7 @@ test.describe( 'Synced pattern', () => { ).toBe( true ); // Check that the new pattern is available in the inserter. - await page.getByLabel( 'Toggle block inserter' ).click(); + await page.getByLabel( 'Block Inserter' ).click(); await page .getByRole( 'tab', { name: 'Patterns', @@ -496,7 +496,7 @@ test.describe( 'Synced pattern', () => { } ); await page - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); await page .getByRole( 'searchbox', { diff --git a/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js b/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js index cfaf4e0be9188f..fc54a1a71c8daa 100644 --- a/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js +++ b/test/e2e/specs/editor/various/shortcut-focus-toolbar.spec.js @@ -201,11 +201,11 @@ class ToolbarUtils { this.pageUtils = pageUtils; this.documentToolbarButton = this.page.getByRole( 'button', { - name: 'Toggle block inserter', + name: 'Block Inserter', exact: true, } ); this.documentToolbarTooltip = this.page.locator( - 'text=Toggle block inserter' + 'text=Block Inserter' ); this.blockToolbarParagraphButton = this.page.getByRole( 'button', { name: 'Paragraph', diff --git a/test/e2e/specs/site-editor/block-style-variations.spec.js b/test/e2e/specs/site-editor/block-style-variations.spec.js index 97ebc74db8308a..3c642ea9d1299e 100644 --- a/test/e2e/specs/site-editor/block-style-variations.spec.js +++ b/test/e2e/specs/site-editor/block-style-variations.spec.js @@ -318,7 +318,7 @@ async function draftNewPage( page ) { // Create a Group block with 2 nested Group blocks. async function addPageContent( editor, page ) { const inserterButton = page.locator( - 'role=button[name="Toggle block inserter"i]' + 'role=button[name="Block Inserter"i]' ); await inserterButton.click(); await page.type( 'role=searchbox[name="Search"i]', 'Group' ); diff --git a/test/e2e/specs/site-editor/pages.spec.js b/test/e2e/specs/site-editor/pages.spec.js index 7a76db40337c2c..4817651bac8f9d 100644 --- a/test/e2e/specs/site-editor/pages.spec.js +++ b/test/e2e/specs/site-editor/pages.spec.js @@ -36,7 +36,9 @@ async function addPageContent( editor, page ) { .fill( 'Lorem ipsum dolor sit amet' ); // Insert into Page Content using global inserter. - await page.getByRole( 'button', { name: 'Toggle block inserter' } ).click(); + await page + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) + .click(); await page.getByRole( 'option', { name: 'Heading', exact: true } ).click(); await editor.canvas .getByRole( 'document', { diff --git a/test/e2e/specs/site-editor/site-editor-inserter.spec.js b/test/e2e/specs/site-editor/site-editor-inserter.spec.js index acb0c5409f9b09..04075cbedab308 100644 --- a/test/e2e/specs/site-editor/site-editor-inserter.spec.js +++ b/test/e2e/specs/site-editor/site-editor-inserter.spec.js @@ -24,13 +24,13 @@ test.describe( 'Site Editor Inserter', () => { test( 'inserter toggle button should toggle global inserter', async ( { page, } ) => { - await page.click( 'role=button[name="Toggle block inserter"i]' ); + await page.click( 'role=button[name="Block Inserter"i]' ); // Visibility check await expect( page.locator( 'role=searchbox[name="Search"i]' ) ).toBeVisible(); - await page.click( 'role=button[name="Toggle block inserter"i]' ); + await page.click( 'role=button[name="Block Inserter"i]' ); //Hidden State check await expect( page.locator( 'role=searchbox[name="Search"i]' ) @@ -43,7 +43,8 @@ test.describe( 'Site Editor Inserter', () => { editor, } ) => { const inserterButton = page.getByRole( 'button', { - name: 'Toggle block inserter', + name: 'Block Inserter', + exact: true, } ); const blockLibrary = page.getByRole( 'region', { name: 'Block Library', diff --git a/test/e2e/specs/site-editor/style-book.spec.js b/test/e2e/specs/site-editor/style-book.spec.js index 3f871d28ef941b..9a34f30f82ff9c 100644 --- a/test/e2e/specs/site-editor/style-book.spec.js +++ b/test/e2e/specs/site-editor/style-book.spec.js @@ -29,7 +29,7 @@ test.describe( 'Style Book', () => { test( 'should disable toolbar buttons when open', async ( { page } ) => { await expect( - page.locator( 'role=button[name="Toggle block inserter"i]' ) + page.locator( 'role=button[name="Block Inserter"i]' ) ).toBeDisabled(); await expect( page.locator( 'role=button[name="Tools"i]' ) diff --git a/test/e2e/specs/widgets/editing-widgets.spec.js b/test/e2e/specs/widgets/editing-widgets.spec.js index 92a264492c018d..019e07fe87daac 100644 --- a/test/e2e/specs/widgets/editing-widgets.spec.js +++ b/test/e2e/specs/widgets/editing-widgets.spec.js @@ -56,7 +56,7 @@ test.describe( 'Widgets screen', () => { await page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); const blockLibrary = page.getByRole( 'region', { name: 'Block Library', @@ -698,7 +698,7 @@ class WidgetsScreen { if ( await blockLibrary.isHidden() ) { await this.#page .getByRole( 'toolbar', { name: 'Document tools' } ) - .getByRole( 'button', { name: 'Toggle block inserter' } ) + .getByRole( 'button', { name: 'Block Inserter', exact: true } ) .click(); } diff --git a/test/performance/specs/post-editor.spec.js b/test/performance/specs/post-editor.spec.js index 20925ebb36587f..becbf375eff2ac 100644 --- a/test/performance/specs/post-editor.spec.js +++ b/test/performance/specs/post-editor.spec.js @@ -368,9 +368,11 @@ test.describe( 'Post Editor Performance', () => { // Go to the test page. await admin.editPost( draftId ); await perfUtils.disableAutosave(); - const globalInserterToggle = page.getByRole( 'button', { - name: 'Toggle block inserter', - } ); + const globalInserterToggle = page + .getByRole( 'region', { name: 'Editor top bar' } ) + .getByRole( 'button', { + name: 'Block Inserter', + } ); const samples = 10; const throwaway = 1; @@ -424,9 +426,11 @@ test.describe( 'Post Editor Performance', () => { // Go to the test page. await admin.editPost( draftId ); await perfUtils.disableAutosave(); - const globalInserterToggle = page.getByRole( 'button', { - name: 'Toggle block inserter', - } ); + const globalInserterToggle = page + .getByRole( 'region', { name: 'Editor top bar' } ) + .getByRole( 'button', { + name: 'Block Inserter', + } ); // Open Inserter. await globalInserterToggle.click(); @@ -483,9 +487,11 @@ test.describe( 'Post Editor Performance', () => { await admin.editPost( draftId ); await perfUtils.disableAutosave(); - const globalInserterToggle = page.getByRole( 'button', { - name: 'Toggle block inserter', - } ); + const globalInserterToggle = page + .getByRole( 'region', { name: 'Editor top bar' } ) + .getByRole( 'button', { + name: 'Block Inserter', + } ); const paragraphBlockItem = page.locator( '.block-editor-inserter__menu .editor-block-list-item-paragraph' ); @@ -535,9 +541,11 @@ test.describe( 'Post Editor Performance', () => { test( 'Run the test', async ( { page, admin, perfUtils } ) => { await admin.createNewPost(); await perfUtils.disableAutosave(); - const globalInserterToggle = page.getByRole( 'button', { - name: 'Toggle block inserter', - } ); + const globalInserterToggle = page + .getByRole( 'region', { name: 'Editor top bar' } ) + .getByRole( 'button', { + name: 'Block Inserter', + } ); const testPatterns = [ {