Link Format: collapse selection to end after insert (#17126)

* Link Format: collapse selection to end after insert * Fix rebase & e2e tests The inserting of links cahnges, so need to remove the click to apply, and add tab + enter. Co-authored-by: Marcus Kazmierczak <[email protected]>
WordPress · Apr 14, 2020 · 0c6d95f · 0c6d95f
1 parent 527e7f1
commit 0c6d95f
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 11 deletions.
diff --git a/packages/e2e-tests/specs/editor/various/links.test.js b/packages/e2e-tests/specs/editor/various/links.test.js
@@ -200,6 +200,9 @@ describe( 'Links', () => {
 
 		// Click on the Submit button
 		await page.keyboard.press( 'Enter' );
+
+		// Reselect the link.
+		await pressKeyWithModifier( 'shiftAlt', 'ArrowLeft' );
 	};
 
 	it( 'can be edited', async () => {
@@ -490,13 +493,6 @@ describe( 'Links', () => {
 		await waitForAutoFocus();
 		await page.keyboard.type( 'w.org' );
 
-		// Insert the link
-		await page.keyboard.press( 'Enter' );
-
-		// Navigate back to the popover
-		await pressKeyWithModifier( 'primary', 'k' );
-		await waitForAutoFocus();
-
 		// Navigate to and toggle the "Open in new tab" checkbox.
 		await page.keyboard.press( 'Tab' );
 		await page.keyboard.press( 'Tab' );
@@ -508,7 +504,8 @@ describe( 'Links', () => {
 
 		// Close dialog. Expect that "Open in new tab" would have been applied
 		// immediately.
-		await page.keyboard.press( 'Escape' );
+		await page.keyboard.press( 'Tab' );
+		await page.keyboard.press( 'Enter' );
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 
@@ -519,9 +516,10 @@ describe( 'Links', () => {
 		//
 		// See: https://github.com/WordPress/gutenberg/pull/15573
 
-		// Collapse selection.
+		// Move caret back into the link.
 		await page.keyboard.press( 'ArrowLeft' );
-		await page.keyboard.press( 'ArrowRight' );
+		await page.keyboard.press( 'ArrowLeft' );
+
 		// Edit link.
 		await pressKeyWithModifier( 'primary', 'k' );
 		await waitForAutoFocus();
@@ -532,6 +530,10 @@ describe( 'Links', () => {
 		await page.keyboard.press( 'Enter' );
 
 		// Navigate back to the popover
+		await page.keyboard.press( 'ArrowLeft' );
+		await page.keyboard.press( 'ArrowLeft' );
+
+		// Navigate back to inputs to verify appears as changed.
 		await pressKeyWithModifier( 'primary', 'k' );
 		await waitForAutoFocus();
 

diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
@@ -128,7 +128,10 @@ function InlineLinkUI( {
 			);
 			onChange( insert( value, toInsert ) );
 		} else {
-			onChange( applyFormat( value, format ) );
+			const newValue = applyFormat( value, format );
+			newValue.start = newValue.end;
+			newValue.activeFormats = [];
+			onChange( newValue );
 		}
 
 		// Focus should only be shifted back to the formatted segment when the