Safari: fix Shift+Click multi select (#53440)

packages/block-editor/src/components/copy-handler/index.js

@@ -198,6 +198,7 @@ export function useClipboardHandler() {
 				if ( shouldHandleWholeBlocks && ! expandSelectionIsNeeded ) {
 					removeBlocks( selectedBlockClientIds );
 				} else {
+					event.target.ownerDocument.activeElement.contentEditable = false;
 					__unstableDeleteSelection();
 				}
 			} else if ( event.type === 'paste' ) {

packages/block-editor/src/components/rich-text/index.js

@@ -412,6 +412,13 @@ function RichTextWrapper(
 					props.className,
 					'rich-text'
 				) }
+				// Setting tabIndex to 0 is unnecessary, the element is already
+				// focusable because it's contentEditable. This also fixes a
+				// Safari bug where it's not possible to Shift+Click multi
+				// select blocks when Shift Clicking into an element with
+				// tabIndex because Safari will focus the element. However,
+				// Safari will correctly ignore nested contentEditable elements.
+				tabIndex={ props.tabIndex === 0 ? null : props.tabIndex }
 			/>
 		</>
 	);

test/e2e/specs/editor/various/multi-block-selection.spec.js

@@ -1179,7 +1179,7 @@ test.describe( 'Multi-block selection', () => {
 		] );
 	} );
 
-	test( 'should partially select with shift + click', async ( {
+	test( 'should partially select with shift + click (@webkit)', async ( {
 		page,
 		editor,
 	} ) => {
@@ -1213,6 +1213,8 @@ test.describe( 'Multi-block selection', () => {
 			// Ensure clicking on the right half of the element.
 			position: { x: strongBox.width, y: strongBox.height / 2 },
 			modifiers: [ 'Shift' ],
+			// "<p>" intercepts pointer events in WebKit.
+			force: true,
 		} );
 		await page.keyboard.press( 'Backspace' );