Writing Flow: fix reverse selection after block deletion from rich te…

…xt (#22292) * Writing Flow: fix reverse selection after block deletion from rich text * Lint * Add e2e test
WordPress · May 12, 2020 · 903e52c · 903e52c
1 parent 650eefc
commit 903e52c
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 2 deletions.
diff --git a/packages/block-editor/src/components/block-list/block.js b/packages/block-editor/src/components/block-list/block.js
@@ -17,7 +17,12 @@ import {
 	getBlockDefaultClassName,
 } from '@wordpress/blocks';
 import { withFilters } from '@wordpress/components';
-import { withDispatch, withSelect, useSelect } from '@wordpress/data';
+import {
+	withDispatch,
+	withSelect,
+	useSelect,
+	useDispatch,
+} from '@wordpress/data';
 import { withViewportMatch } from '@wordpress/viewport';
 import { compose, pure, ifCondition } from '@wordpress/compose';
 
@@ -74,6 +79,8 @@ function BlockListBlock( {
 			isHighlighted: isBlockHighlighted( clientId ),
 		};
 	}, [] );
+	const { removeBlock } = useDispatch( 'core/block-editor' );
+	const onRemove = () => removeBlock( clientId );
 
 	// Handling the error state
 	const [ hasError, setErrorState ] = useState( false );
@@ -137,6 +144,7 @@ function BlockListBlock( {
 			setAttributes={ setAttributes }
 			insertBlocksAfter={ isLocked ? undefined : onInsertBlocksAfter }
 			onReplace={ isLocked ? undefined : onReplace }
+			onRemove={ isLocked ? undefined : onRemove }
 			mergeBlocks={ isLocked ? undefined : onMerge }
 			clientId={ clientId }
 			isSelectionEnabled={ isSelectionEnabled }

diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js
@@ -1212,6 +1212,8 @@ export function initialPosition( state, action ) {
 		return action.initialPosition;
 	} else if ( action.type === 'REMOVE_BLOCKS' ) {
 		return state;
+	} else if ( action.type === 'START_TYPING' ) {
+		return state;
 	}
 
 	// Reset the state by default (for any action not handled).

diff --git a/packages/block-library/src/paragraph/edit.js b/packages/block-library/src/paragraph/edit.js
@@ -94,6 +94,7 @@ function ParagraphBlock( {
 	attributes,
 	mergeBlocks,
 	onReplace,
+	onRemove,
 	setAttributes,
 } ) {
 	const {
@@ -178,7 +179,7 @@ function ParagraphBlock( {
 				} }
 				onMerge={ mergeBlocks }
 				onReplace={ onReplace }
-				onRemove={ onReplace ? () => onReplace( [] ) : undefined }
+				onRemove={ onRemove }
 				aria-label={
 					content
 						? __( 'Paragraph block' )

diff --git a/packages/e2e-tests/specs/editor/blocks/image.test.js b/packages/e2e-tests/specs/editor/blocks/image.test.js
@@ -85,4 +85,17 @@ describe( 'Image', () => {
 
 		expect( await getEditedPostContent() ).toBe( '' );
 	} );
+
+	it( 'should place caret at end of caption after merging empty paragraph', async () => {
+		await insertBlock( 'Image' );
+		await upload( '.wp-block-image input[type="file"]' );
+		await page.keyboard.type( '1' );
+		await insertBlock( 'Paragraph' );
+		await page.keyboard.press( 'Backspace' );
+		await page.keyboard.type( '2' );
+
+		expect(
+			await page.evaluate( () => document.activeElement.innerHTML )
+		).toBe( '12' );
+	} );
 } );