Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Link Shortcut: Only trigger the link shortcut if there's a text selection #66056

Merged
merged 3 commits into from
Oct 23, 2024
Merged

Link Shortcut: Only trigger the link shortcut if there's a text selection #66056

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e92fd22
Link Shortcut: Only trigger the link shortcut if there's a text selec…
youknowriad Oct 11, 2024
3d93f3d
Fix e2e tests
youknowriad Oct 15, 2024
1fbf6cd
Restore useful e2e tests
youknowriad Oct 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 9 additions & 1 deletion packages/format-library/src/link/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -170,9 +170,17 @@ function Edit( {
openedBy?.el?.tagName === 'A' && openedBy?.action === 'click'
);

const hasSelection = ! isCollapsed( value );

return (
<>
<RichTextShortcut type="primary" character="k" onUse={ addLink } />
{ hasSelection && (
<RichTextShortcut
type="primary"
character="k"
onUse={ addLink }
/>
) }
<RichTextShortcut
type="primaryShift"
character="k"
Expand Down
48 changes: 7 additions & 41 deletions test/e2e/specs/editor/blocks/links.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -121,38 +121,6 @@ test.describe( 'Links', () => {
).toHaveValue( '' );
} );

test( `can be created without any text selected`, async ( {
page,
editor,
pageUtils,
} ) => {
// Create a block with some text.
await editor.insertBlock( {
name: 'core/paragraph',
} );
await page.keyboard.type( 'This is Gutenberg: ' );

// Press Cmd+K to insert a link.
await pageUtils.pressKeys( 'primary+K' );

// Type a URL.
await page.keyboard.type( 'https://wordpress.org/gutenberg' );

// Press Enter to apply the link.
await pageUtils.pressKeys( 'Enter' );

// 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: <a href="https://wordpress.org/gutenberg">https://wordpress.org/gutenberg</a>',
},
},
] );
} );

test( `will automatically create a link if selected text is a valid HTTP based URL`, async ( {
page,
editor,
Expand Down Expand Up @@ -341,7 +309,7 @@ test.describe( 'Links', () => {
// Make a collapsed selection inside the link.
await pageUtils.pressKeys( 'ArrowLeft' );
await pageUtils.pressKeys( 'ArrowRight' );
await pageUtils.pressKeys( 'primary+k' );
await editor.clickBlockToolbarButton( 'Link' );

const linkPopover = LinkUtils.getLinkPopover();
await linkPopover.getByRole( 'button', { name: 'Edit' } ).click();
Expand Down Expand Up @@ -485,9 +453,8 @@ test.describe( 'Links', () => {
await pageUtils.pressKeys( 'End' );
await expect( linkPopover ).toBeHidden();

// Move the caret back into the link text and the link popover
// should not be displayed.
await pageUtils.pressKeys( 'ArrowLeft' );
// Move the caret back into and selects the link text.
await pageUtils.pressKeys( 'shiftAlt+ArrowLeft' );
await expect( linkPopover ).toBeHidden();

// Switch the Link UI into "Edit" mode via keyboard shortcut
Expand Down Expand Up @@ -1015,7 +982,6 @@ test.describe( 'Links', () => {
test( 'should not display text input when initially creating the link', async ( {
stokesman marked this conversation as resolved.
Show resolved Hide resolved
page,
editor,
pageUtils,
LinkUtils,
} ) => {
// Create a block with some text.
Expand All @@ -1024,8 +990,8 @@ test.describe( 'Links', () => {
} );
await page.keyboard.type( 'This is Gutenberg: ' );

// Press Cmd+K to insert a link.
await pageUtils.pressKeys( 'primary+k' );
// Insert a link
await editor.clickBlockToolbarButton( 'Link' );

const linkPopover = LinkUtils.getLinkPopover();

Expand All @@ -1048,8 +1014,8 @@ test.describe( 'Links', () => {
// Make a collapsed selection inside the link. This is used
// as a stress test to ensure we can find the link text from a
// collapsed RichTextValue that contains a link format.
await pageUtils.pressKeys( 'ArrowLeft' );
await pageUtils.pressKeys( 'ArrowRight' );
await pageUtils.pressKeys( 'End' );
await pageUtils.pressKeys( 'shiftAlt+ArrowLeft' );
await pageUtils.pressKeys( 'primary+k' );

const linkPopover = LinkUtils.getLinkPopover();
Expand Down
Loading