From 57750383b50d9a46b07a88ac5484e68ed033df26 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Wed, 7 Feb 2024 11:24:57 +0000 Subject: [PATCH 1/2] Correct conditional --- packages/format-library/src/link/index.js | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/format-library/src/link/index.js b/packages/format-library/src/link/index.js index 61b6f974cdce3a..d10c0f7c975e39 100644 --- a/packages/format-library/src/link/index.js +++ b/packages/format-library/src/link/index.js @@ -42,6 +42,8 @@ function Edit( { // We only need to store the button element that opened the popover. We can ignore the other states, as they will be handled by the onFocus prop to return to the rich text field. const [ openedBy, setOpenedBy ] = useState( null ); + const canMakeLink = ! isCollapsed( value ) || addingLink || isActive; + useLayoutEffect( () => { const editableContentElement = contentRef.current; if ( ! editableContentElement ) { @@ -138,7 +140,13 @@ function Edit( { return ( <> - + { canMakeLink && ( + + ) } { addingLink && ( Date: Wed, 7 Feb 2024 11:37:48 +0000 Subject: [PATCH 2/2] Update e2e tests to match new behaviour --- test/e2e/specs/editor/blocks/links.spec.js | 78 +++++----------------- 1 file changed, 17 insertions(+), 61 deletions(-) diff --git a/test/e2e/specs/editor/blocks/links.spec.js b/test/e2e/specs/editor/blocks/links.spec.js index 2e6681c2d0701f..4a6ae11c14ddcd 100644 --- a/test/e2e/specs/editor/blocks/links.spec.js +++ b/test/e2e/specs/editor/blocks/links.spec.js @@ -18,50 +18,6 @@ test.describe( 'Links', () => { }, } ); - test( `will use Post title as link text if link to existing post is created without any text selected`, async ( { - admin, - page, - editor, - requestUtils, - } ) => { - const titleText = 'Post to create a link to'; - const { id: postId } = await requestUtils.createPost( { - title: titleText, - status: 'publish', - } ); - - await admin.createNewPost(); - - // Now in a new post and try to create a link from an autocomplete suggestion using the keyboard. - await editor.insertBlock( { - name: 'core/paragraph', - } ); - await page.keyboard.type( 'Here comes a link: ' ); - - // Insert a link deliberately not selecting any text. - await editor.clickBlockToolbarButton( 'Link' ); - - // Trigger the autocomplete suggestion list and select the first suggestion. - await page.keyboard.type( 'Post to create a' ); - await page.getByRole( 'option', { name: titleText } ).click(); - - await expect.poll( editor.getBlocks ).toMatchObject( [ - { - name: 'core/paragraph', - attributes: { - content: - 'Here comes a link: ' + - titleText + - '', - }, - }, - ] ); - } ); - test( `can be created by selecting text and clicking link insertion button in block toolbar`, async ( { page, editor, @@ -121,10 +77,11 @@ test.describe( 'Links', () => { ).toHaveValue( '' ); } ); - test( `can be created without any text selected`, async ( { + test( `cannot be created without any text selected`, async ( { page, editor, pageUtils, + LinkUtils, } ) => { // Create a block with some text. await editor.insertBlock( { @@ -132,25 +89,24 @@ test.describe( 'Links', () => { } ); await page.keyboard.type( 'This is Gutenberg: ' ); - // Press Cmd+K to insert a link. - await pageUtils.pressKeys( 'primary+K' ); + await editor.showBlockToolbar(); - // Type a URL. - await page.keyboard.type( 'https://wordpress.org/gutenberg' ); + // Check that the Link button is disabled. + await page + .getByRole( 'toolbar', { + name: 'Block tools', + } ) + .getByRole( 'button', { + name: 'Link', + } ) + .isDisabled(); - // Press Enter to apply the link. - await pageUtils.pressKeys( 'Enter' ); + // Try Cmd+K to insert a link. + await pageUtils.pressKeys( 'primary+K' ); - // A link with the URL as its text should have been inserted. - await expect.poll( editor.getBlocks ).toMatchObject( [ - { - name: 'core/paragraph', - attributes: { - content: - 'This is Gutenberg: https://wordpress.org/gutenberg', - }, - }, - ] ); + // Expect the link popover not to be visible because + // there is no text selection. + await expect( LinkUtils.getLinkPopover() ).toBeHidden(); } ); test( `will automatically create a link if selected text is a valid HTTP based URL`, async ( {