From 31d9f7feaf742daff18392a4ea9fec019e7d018c Mon Sep 17 00:00:00 2001
From: Tetsuaki Hamano <tetsuaki.hamano@gmail.com>
Date: Wed, 8 May 2024 17:16:53 +0900
Subject: [PATCH] Keep focus within the list view

---
 .../block-editor/src/components/list-view/block.js   | 12 ++++++++----
 test/e2e/specs/editor/various/list-view.spec.js      |  3 +--
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/packages/block-editor/src/components/list-view/block.js b/packages/block-editor/src/components/list-view/block.js
index db542ad08935f8..453b484b3476dd 100644
--- a/packages/block-editor/src/components/list-view/block.js
+++ b/packages/block-editor/src/components/list-view/block.js
@@ -333,17 +333,21 @@ function ListViewBlock( {
 			// Expand all parents of the current block.
 			expand( blockParents );
 		} else if ( isMatch( 'core/block-editor/group', event ) ) {
-			const clientIds = getSelectedBlockClientIds();
-			if ( clientIds.length > 1 && isGroupable( clientIds ) ) {
+			const { blocksToUpdate } = getBlocksToUpdate();
+			if ( blocksToUpdate.length > 1 && isGroupable( blocksToUpdate ) ) {
 				event.preventDefault();
-				const blocks = getBlocksByClientId( clientIds );
+				const blocks = getBlocksByClientId( blocksToUpdate );
 				const groupingBlockName = getGroupingBlockName();
 				const newBlocks = switchToBlockType(
 					blocks,
 					groupingBlockName
 				);
-				replaceBlocks( clientIds, newBlocks );
+				replaceBlocks( blocksToUpdate, newBlocks );
 				speak( __( 'Selected blocks are grouped.' ) );
+				const newlySelectedBlocks = getSelectedBlockClientIds();
+				// Focus the first block of the newly inserted blocks, to keep focus within the list view.
+				setOpenedBlockSettingsMenu( undefined );
+				updateFocusAndSelection( newlySelectedBlocks[ 0 ], false );
 			}
 		}
 	}
diff --git a/test/e2e/specs/editor/various/list-view.spec.js b/test/e2e/specs/editor/various/list-view.spec.js
index a4845392e70455..143fea43c09eef 100644
--- a/test/e2e/specs/editor/various/list-view.spec.js
+++ b/test/e2e/specs/editor/various/list-view.spec.js
@@ -1005,11 +1005,10 @@ test.describe( 'List View', () => {
 			.poll( listViewUtils.getBlocksWithA11yAttributes )
 			.toMatchObject( [
 				{ name: 'core/paragraph', selected: false, focused: false },
-
 				{
 					name: 'core/group',
 					selected: true,
-					focused: false,
+					focused: true,
 					innerBlocks: [
 						{
 							name: 'core/heading',