Block Switcher: Use a different label for multi-selection (WordPress#…

…54692) * Block Switcher: Use a different label for multi-selection * Update snapshot * Adjust e2e tests
foosantos · Sep 21, 2023 · 8ab2a97 · 8ab2a97
1 parent c7d0e6e
commit 8ab2a97
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 22 deletions.
diff --git a/packages/block-editor/src/components/block-switcher/index.js b/packages/block-editor/src/components/block-switcher/index.js
@@ -93,8 +93,10 @@ export const BlockSwitcherDropdownMenu = ( { clientIds, blocks } ) => {
 		clientId: Array.isArray( clientIds ) ? clientIds[ 0 ] : clientIds,
 		maximumLength: 35,
 	} );
-	const isReusable = blocks.length === 1 && isReusableBlock( blocks[ 0 ] );
-	const isTemplate = blocks.length === 1 && isTemplatePart( blocks[ 0 ] );
+
+	const isSingleBlock = blocks.length === 1;
+	const isReusable = isSingleBlock && isReusableBlock( blocks[ 0 ] );
+	const isTemplate = isSingleBlock && isTemplatePart( blocks[ 0 ] );
 
 	function selectForMultipleBlocks( insertedBlocks ) {
 		if ( insertedBlocks.length > 1 ) {
@@ -162,24 +164,21 @@ export const BlockSwitcherDropdownMenu = ( { clientIds, blocks } ) => {
 		);
 	}
 
-	const blockSwitcherLabel = blockTitle;
+	const blockSwitcherLabel = isSingleBlock
+		? blockTitle
+		: __( 'Multiple blocks selected' );
 
-	const blockSwitcherDescription =
-		1 === blocks.length
-			? sprintf(
-					/* translators: %s: block title. */
-					__( '%s: Change block type or style' ),
-					blockTitle
-			  )
-			: sprintf(
-					/* translators: %d: number of blocks. */
-					_n(
-						'Change type of %d block',
-						'Change type of %d blocks',
-						blocks.length
-					),
+	const blockSwitcherDescription = isSingleBlock
+		? __( 'Change block type or style' )
+		: sprintf(
+				/* translators: %d: number of blocks. */
+				_n(
+					'Change type of %d block',
+					'Change type of %d blocks',
 					blocks.length
-			  );
+				),
+				blocks.length
+		  );
 
 	const hasBlockOrBlockVariationTransforms =
 		hasPossibleBlockTransformations ||

diff --git a/packages/block-editor/src/components/block-switcher/test/__snapshots__/index.js.snap b/packages/block-editor/src/components/block-switcher/test/__snapshots__/index.js.snap
@@ -48,7 +48,7 @@ exports[`BlockSwitcherDropdownMenu should render enabled block switcher with mul
         aria-describedby="components-button__description-2"
         aria-expanded="false"
         aria-haspopup="true"
-        aria-label="Block Name"
+        aria-label="Multiple blocks selected"
         class="components-button components-dropdown-menu__toggle has-icon"
         data-toolbar-item="true"
         type="button"
@@ -105,7 +105,7 @@ exports[`BlockSwitcherDropdownMenu should render switcher with blocks 1`] = `
         <span
           id="components-button__description-0"
         >
-          Block Name: Change block type or style
+          Change block type or style
         </span>
       </div>
     </div>

diff --git a/test/e2e/specs/editor/blocks/list.spec.js b/test/e2e/specs/editor/blocks/list.spec.js
@@ -1345,7 +1345,9 @@ test.describe( 'List (@firefox)', () => {
 <p>2</p>
 <!-- /wp:paragraph -->` );
 
-		await page.getByRole( 'button', { name: 'Paragraph' } ).click();
+		await page
+			.getByRole( 'button', { name: 'Multiple blocks selected' } )
+			.click();
 		await page.getByRole( 'menuitem', { name: 'List' } ).click();
 
 		expect( await editor.getEditedPostContent() ).toBe( `<!-- wp:list -->

diff --git a/test/e2e/specs/editor/various/keep-styles-on-block-transforms.spec.js b/test/e2e/specs/editor/various/keep-styles-on-block-transforms.spec.js
@@ -54,7 +54,7 @@ test.describe( 'Keep styles on block transforms', () => {
 		await pageUtils.pressKeys( 'shift+ArrowUp' );
 		await pageUtils.pressKeys( 'shift+ArrowUp' );
 		await page.click( 'role=radio[name="Large"i]' );
-		await page.click( 'role=button[name="Paragraph"i]' );
+		await page.click( 'role=button[name="Multiple blocks selected"i]' );
 		await page.click( 'role=menuitem[name="Heading"i]' );
 
 		await expect.poll( editor.getBlocks ).toMatchObject( [