From 72f3ebc3a7f3318f725d6e954f3a814b3e4618d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <iseulde@automattic.com>
Date: Thu, 11 Apr 2019 18:35:07 +0200
Subject: [PATCH] Input Interaction: restore collapsing selection before edge
 calc (#14906)

* Input Interaction: restore collapsing selection before edge calc

* Add e2e test

* Fix other e2e test

* Clean up

* Do not modify live range in getRectangleFromRange
---
 packages/dom/src/dom.js                         | 17 ++++++++++++++---
 .../__snapshots__/writing-flow.test.js.snap     | 10 ++++++++++
 packages/e2e-tests/specs/adding-blocks.test.js  |  1 -
 packages/e2e-tests/specs/writing-flow.test.js   | 15 +++++++++++++++
 4 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js
index 8be06daaaa320..aba561f992d59 100644
--- a/packages/dom/src/dom.js
+++ b/packages/dom/src/dom.js
@@ -93,7 +93,16 @@ function isEdge( container, isReverse, onlyVertical ) {
 		return false;
 	}
 
-	const rangeRect = getRectangleFromRange( selection.getRangeAt( 0 ) );
+	const range = selection.getRangeAt( 0 ).cloneRange();
+	const isForward = isSelectionForward( selection );
+	const isCollapsed = selection.isCollapsed;
+
+	// Collapse in direction of selection.
+	if ( ! isCollapsed ) {
+		range.collapse( ! isForward );
+	}
+
+	const rangeRect = getRectangleFromRange( range );
 
 	if ( ! rangeRect ) {
 		return false;
@@ -105,9 +114,9 @@ function isEdge( container, isReverse, onlyVertical ) {
 	// Only consider the multiline selection at the edge if the direction is
 	// towards the edge.
 	if (
-		! selection.isCollapsed &&
+		! isCollapsed &&
 		rangeRect.height > lineHeight &&
-		isSelectionForward( selection ) === isReverse
+		isForward === isReverse
 	) {
 		return false;
 	}
@@ -213,6 +222,8 @@ export function getRectangleFromRange( range ) {
 	// See: https://stackoverflow.com/a/6847328/995445
 	if ( ! rect ) {
 		const padNode = document.createTextNode( '\u200b' );
+		// Do not modify the live range.
+		range = range.cloneRange();
 		range.insertNode( padNode );
 		rect = range.getClientRects()[ 0 ];
 		padNode.parentNode.removeChild( padNode );
diff --git a/packages/e2e-tests/specs/__snapshots__/writing-flow.test.js.snap b/packages/e2e-tests/specs/__snapshots__/writing-flow.test.js.snap
index 0ea51c111b798..0e41868f3cffa 100644
--- a/packages/e2e-tests/specs/__snapshots__/writing-flow.test.js.snap
+++ b/packages/e2e-tests/specs/__snapshots__/writing-flow.test.js.snap
@@ -187,3 +187,13 @@ exports[`adding blocks should not delete surrounding space when deleting a word
 <p>1 2 3</p>
 <!-- /wp:paragraph -->"
 `;
+
+exports[`adding blocks should not prematurely multi-select 1`] = `
+"<!-- wp:paragraph -->
+<p>1</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph -->
+<p>></p>
+<!-- /wp:paragraph -->"
+`;
diff --git a/packages/e2e-tests/specs/adding-blocks.test.js b/packages/e2e-tests/specs/adding-blocks.test.js
index 7a790862e831c..aeafc65cd8cc3 100644
--- a/packages/e2e-tests/specs/adding-blocks.test.js
+++ b/packages/e2e-tests/specs/adding-blocks.test.js
@@ -66,7 +66,6 @@ describe( 'adding blocks', () => {
 		await page.keyboard.type( 'Foo' );
 		await page.keyboard.press( 'ArrowUp' );
 		await page.keyboard.press( 'ArrowUp' );
-		await pressKeyTimes( 'ArrowRight', 3 );
 		await pressKeyTimes( 'Delete', 6 );
 		await page.keyboard.type( ' text' );
 
diff --git a/packages/e2e-tests/specs/writing-flow.test.js b/packages/e2e-tests/specs/writing-flow.test.js
index c3c4d477e1378..c9ca7bf2021df 100644
--- a/packages/e2e-tests/specs/writing-flow.test.js
+++ b/packages/e2e-tests/specs/writing-flow.test.js
@@ -327,4 +327,19 @@ describe( 'adding blocks', () => {
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 	} );
+
+	it( 'should not prematurely multi-select', async () => {
+		await clickBlockAppender();
+		await page.keyboard.type( '1' );
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( '><<' );
+		await pressKeyWithModifier( 'shift', 'Enter' );
+		await page.keyboard.type( '<<<' );
+		await page.keyboard.down( 'Shift' );
+		await pressKeyTimes( 'ArrowLeft', '<<\n<<<'.length );
+		await page.keyboard.up( 'Shift' );
+		await page.keyboard.press( 'Backspace' );
+
+		expect( await getEditedPostContent() ).toMatchSnapshot();
+	} );
 } );