Reselect block correctly

WordPress · Oct 4, 2019 · 98dae74 · 98dae74
1 parent f1b08ac
commit 98dae74
Showing 1 changed file with 15 additions and 5 deletions.
diff --git a/packages/block-editor/src/components/block-list/index.js b/packages/block-editor/src/components/block-list/index.js
@@ -46,27 +46,37 @@ class BlockList extends Component {
 	componentDidUpdate() {
 		const {
 			hasMultiSelection,
-			selectionStart,
-			selectionEnd,
 			blockClientIds,
+			multiSelectedBlockClientIds,
 		} = this.props;
 
 		if ( ! hasMultiSelection ) {
 			return;
 		}
 
-		const startIndex = blockClientIds.indexOf( selectionStart );
+		const { length } = multiSelectedBlockClientIds;
+		const start = multiSelectedBlockClientIds[ 0 ];
+		const end = multiSelectedBlockClientIds[ length - 1 ];
+		const startIndex = blockClientIds.indexOf( start );
 
 		// The selected block is not in this block list.
 		if ( startIndex === -1 ) {
 			return;
 		}
 
-		const startNode = document.querySelector( `[data-block="${ selectionStart }"]` );
-		const endNode = document.querySelector( `[data-block="${ selectionEnd }"]` );
+		let startNode = document.querySelector( `[data-block="${ start }"]` );
+		let endNode = document.querySelector( `[data-block="${ end }"]` );
 		const selection = window.getSelection();
 		const range = document.createRange();
 
+		while ( startNode.firstChild ) {
+			startNode = startNode.firstChild;
+		}
+
+		while ( endNode.lastChild ) {
+			endNode = endNode.lastChild;
+		}
+
 		range.setStartBefore( startNode );
 		range.setEndAfter( endNode );