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 <[email protected]> Co-authored-by: t-hamano <[email protected]> Co-authored-by: draganescu <[email protected]> Co-authored-by: tyxla <[email protected]> Co-authored-by: kristastevens <[email protected]> Co-authored-by: SantosGuillamot <[email protected]> Co-authored-by: talldan <[email protected]> Co-authored-by: ramonjd <[email protected]> Co-authored-by: youknowriad <[email protected]>
WordPress · Oct 15, 2024 · d655af6 · d655af6
1 parent a55c62c
commit d655af6
Show file tree

Hide file tree

Showing 32 changed files with 99 additions and 85 deletions.
diff --git 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
@@ -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
@@ -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
@@ -47,7 +47,7 @@ export default function InserterSidebar() {
 					__next40pxDefaultSize
 					icon={ close }
 					onClick={ closeInserter }
-					label={ __( 'Close block inserter' ) }
+					label={ __( 'Close Block Inserter' ) }
 				/>
 			</TagName>
 			<div className="edit-widgets-layout__inserter-panel-content">

diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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.